I_ji_you

https://tossmini-docs.toss.im/tds-mobile/ TDS Mobile 문서Toss Design System Mobile (TDS) - 프론트엔드 개발자를 위한 공식 문서 및 컴포넌트 가이드tossmini-docs.toss.im대 디자인 시스템 시대를 연 토스의 TDS https://momentum.design/en/ 👋 Welcome to Momentum Design Docs! 🚀 MomentumThis is the main page.momentum.designhttps://m3.material.io/ Material DesignBuild beautiful, usable products faster. Material Design is an adaptable system—bac..

출처 : '토스 UX 라이터가 알려주는, 유저가 반응하는 광고 소재의 특징' 1. 핵심 메시지만 남기기. 빠르게 지나치는 0.3 초안에 핵심을 남기기 위해서 단일 메시지만 담고, 이중 메시지는 담지 않도록 한다. 하나만 머리에 박히는게 좋고, 이중 메시지는 오히려 마음에 확 들어오는 것이 없고 분산된다2. 최대 혜택 강조보다 확실성 강조 : 얻을 수 있는 최대혜택을 보여주는 것보다 보장된 확실한 혜택을 강조하는 것이 더 유익하다. 왜냐하면 사람들은 이미 최대혜택에 속아 이만큼 받지 못할 것이 대부분이라는 사실을 인지하고 있기 때문이다3. 가입하기보다 준비하기 : 실행 부담이 크게 느껴지는 동사보다 쉽게 시작할 수 있는 동사를 사용해서 무의식적으로 부담을 낮추면 더 쉽게 진입할 수 있다.4. 숫자 구체화 ..

https://rnfltpgus.github.io/knowledge/responsive-web/fluid-grid/ 가변 그리드(Fluid Grid)란?다음 글 React - Suspense, lazy에 대해 잠깐rnfltpgus.github.ioUI 생성 활용 AI Relume AIGalileo AIVisilyAI 다루기 [최고의 프롬프트 엔지니어링 강의] 책 참고 UX 설계 순서1 문제 정의2 IA (정보 구조)3 User Flow (사용 흐름)4 Wireframe (화면 구조)5 UI 디자인6 PrototypeIA정보가 어떻게 정리돼 있지? (설계된 구조와 구조의 집합)sitemapIA 구조 설계 결과 전반User Flow사용자는 어떤 경로로 행동하지? (흐름)Wireframe화면 구조는 어떻게 생..

디자인 토큰https://uxdesign.cc/design-tokens-cheatsheet-927fc1404099 Design tokens cheatsheetA Design System’s strength comes from knowing how and when to apply options (like purple-40 or color-warning) correctly to contexts (like…uxdesign.ccDesign Systems and TokensAs Systems designers, it is our duty to optimize at scale the experiences of Designer and Developers when consuming our product; the sys..

구글의 머티리얼 디자인 구글이 머티리얼 디자인을 설계해 나간 방식을 보고 UX/UI 역사에 대해 알아보고 싶어졌다https://developer.apple.com/kr/design/human-interface-guidelines/ 휴먼 인터페이스 가이드라인(HIG) | Apple Developer DocumentationHIG는 모든 Apple 플랫폼에서 탁월한 경험을 제공할 수 있도록 도움을 주는 지침과 모범 사례를 포함합니다.developer.apple.comhttps://m3.material.io/ Material DesignBuild beautiful, usable products faster. Material Design is an adaptable system—backed by open-sou..

Navigation bar 와 App bar위치나 디바이스 서비스 등등 가타부타의 이유로 명칭이 고정되어 있지 않은 편이라 명칭을 딱 잘라 구분하지 않고 혼용하기도 함. global navigation bar - 한번에 사용자가 바로 이동할 수 있도록 메뉴를 다 노출 시키기 위한 경우. 2026 나이키 공홈 웹사이트 참고 columns과 gridgrid system design 핀터 검색column / gutter(spacing) / margin메뉴 라벨이 안적혀 있는 경우 이유는 사용자들이 이미 친숙한 경우에 ! 앱 서비스 이용자들이 장기화 된 경우.. bottom naviation bar 가 모바일 디바이스 화면에 흔한 이유는 엄지 손가락이 쉽게 닿는 지점에 중요하고 자주 사용되는 네이게이션을 위치시..

A/B 테스트 질문법[목적] [상황] [핵심 명령어] 포함넷플릭스의 [새로운 기능에 대한 클릭률]을 높이기 위해 아래 두 가지 버전의 문구를 대상으로 [A/B 테스트를 진행]할거야. 어떤 문구가 더 클릭율이 높을지에 대한 [가설과 그 이유]를 정리해줘. A/B 테스트 목표와 성과지표 설정생성한 UX writing 문구를 A/B 테스트 할 수 있도록 metrics와 목표를 정해줘 Figma피그마 단축키피그마 플러그인 기능 등 검색https://help.figma.com/hc/en-us Figma Learn - Help CenterFigma Sites collection Learn the basics of Figma Sites so you can design, prototype, and publish hi..

프롬프트 엔지니어링AI에게 명령할 때 디테일하게 요구하기 위한 요소를 체화하는 게 필요할 거 같다고 생각했다.다만, 너무 상세히 작성하다 보면 힘들거니와 효율이 그만큼 떨어지기에어떤 요소를 꼭 넣고 어떻게 명령해야 할지 중요해 보였다.프롬프트 엔지니어링을 배운 것과 별개로 어떤 포인트를 짚어줘야 나랑 꼭 맞게 나와줄지 세세하게 말해야 하는 것이 말이다. 타 수강생분들은 이런 식으로 프롬프트를 작성하셨는데 인상 깊었다.1. 상황, 텍스트, 포인트를 핵심으로 짚음2. 먼저 대화로 페르소나를 간단히 만들고, scene - visual - action&UI - story(caption)으로 구성 따라, 스토리 보드를 구상할 때 AI에게 퍼소나를 먼저 맡겨서 이미지 프롬프트 생성까지 맡기는 것이 가장 편리하겠다고..