
KREAM KREAM, 선정 이유 : 심플하고 깔끔한 UI 서비스 소개 : 거래 중개 플랫폼, 판매자가 가격을 제시하면 구매자가 가격을 수락하는 식으로 이루어진다. UI/UX 회원가입 제공 시점 : 홈 -> MY 페이지 -> 로그인 회원가입 프로세스 : 화면별 구성 : 홈 화면에서 'MY' 버튼이나 우측 상단 종 아이콘 클릭-> 로그인 화면-> 이메일 가입 OR 네이버로 로그인 OR Apple로 로그인 인상깊은 UI/UX : 'STYLE' 이란 화면을 따로 구성하여 요즘 트렌드와 셀럽들의 스타일 등을 볼 수 있다. 개선 1. 회원가입 종류가 이메일 가입이 기본으로 네이버, Apple 로그인 세 가지이다. : 하단에 '다른 서비스 계정으로 가입' -> 카카오톡 계정으로 간편 로그인할 수 있게 만들어 사용성..
https://www.adobe.com/kr/creativecloud/design/hub/guides/15-rules-every-ux-designer-should-know.html 모든 UX 디자이너가 알아야 할 15가지 원칙 | 어도비 크리에이티브 클라우드 | 씽킹 디자인 | 미디 좋은 UX/UI 경험을 만들기 위해 UX 디자이너라면 알아야 할 15가지 필수 규칙을 확인해 보세요. www.adobe.com 사용자 인터페이스는 인간과 제품의 상호 작용이 발생하는 공간이고, 사용자 경험은 제품과의 상호 작용 뒤에 나타나는 감정적 결과다. UX는 UI 그 이상이다. UI -> 경험 -> UX 대상이 누군지를 알아야 하며 그들은 '무지의 상태'라고 여겨야 한다. 짧은 주의 시간을 염두에 두고 단숨에 인지 가능..

카테고리 : 모바일/웹, 업무 용어, 기능, 디자인 패턴, 컴포넌트 /컴포넌트/ *액션 컴포넌트 - 버튼 (Button) : 동작을 할 수 있는 버튼 - 플로팅 버튼 (Floating Action Button) : 화면에 떠 있는 버튼 - 아이콘 버튼 (Icon Button): 아이콘으로 된 버튼 *커뮤니케이선 컴포넌트 - 배지(Badge) : 이미지 옆에 숫자와 같은 카운트 표시 ex) 알림 수 - 프로그레스바(Progress bars) : 작업의 진행 상태를 실시간으로 표시 - CTA(Call To Action) : 사용자의 클릭을 유도하는 행동유도버튼 - 스낵바(Snack Bar) : 행동에 대한 결과를 텍스트로 표시, 몇 초 뒤 자동으로 사라짐 - 툴팁(ToolTip) : 마우스를 올렸을 때 자동..
Facts : 피그마 강의를 들었다. 클론 디자인을 했다. UX 레퍼런스를 찾아봤다. Fellings : 아직 배울 것 투성이라고 생각하니 마음이 복잡하다 ㅜ.ㅜ 그래도 해야지 뭐 어쩌겠 . .. .. . . Findings : 클론 디자인을 해보면서 피그마를 다룰 때 부족한 부분들이 어딘지 알게 되었다. Future : 툴을 12월 2주차까지는 완벽히 다루기 위해서 노력해야겠다. 나중에 제작하고 싶은 UI가 있는데도 툴을 다룰 실력이 없어서 만들지 못하면 속상할 것 같다 // ..

NETFLIX 지난번 넷플릭스 웹의 UI 분석에 이어 넷플릭스 앱을 클론 디자인해보았다!! UI 분석은 웹을 했지만 .. 앱 클론을 할 예정 // 일단 넷플릭스 웹 페이지의 유저 플로우를 제작해봤는데, 계정을 선택한 후 메인 화면에서 아래로 스크롤하여 콘텐츠를 고르거나 GNB 바에서 카테고리를 선택 후 콘텐츠를 고르는 흐름이 나타난다. 지난번에 GNB에서 LNB가 바로 보이지 않는 점을 아쉽다고 이야기한 바 있는데, 지금 생각해 보니 메인 화면에서 시리즈, 영화 등의 카테고리를 눌러서 페이지가 전환될 때마다 전환된 페이지에서는 다양한 콘텐츠들이 쏟아져나온다. 따라서 LNB 메인 화면에서 나오지 않는 이유는 더 많은(?) 콘텐츠를 보여주기 위한 전략이 아닐까 싶기도 하다.. (주관ㅎ.ㅎ) 넷플릭스 앱 클론..

NETFLIX 인터넷(Net)과 영화(Flicks)를 더한 스트리밍(OTT) 플랫폼으로 월정액에 가입하면 영화, 드라마, 애니메이션, TV프로그램 등의 다양한 컨텐츠들을 언제 어디에서나 기기의 제한 없이 무제한으로 즐길 수 있는 서비스이다. 현재 넷플릭스 스트리밍 유저는 23년 10월 기준 약 2억 5천만으로 그 수가 상당하다. 1. NEFLIX Layout 넷플릭스 웹을 접속해 계정을 선택하면 바로 뜨는 메인 화면 화면을 뜯어서 분석해보자 상단에 GNB 네이게이션바가 있고, 돋보기(검색) 버튼을 누르면 우측 상단에는 컨텐츠를 검색할 수 있는 인풋박스가 뜬다. GNB 배너에서 '시리즈'를 클릭해보니 시리즈 화면으로 전환되고, 시리즈 장르를 선택할 수 있는 드롭박스가 나타난다. 드롭박스에는 LNB 메뉴가 ..

피그마가 지원하는 플러그인을 사용하면 포트폴리오 템플릿을 쉽게 제작할 수 있다. 1. 포트폴리오에 본인이 진행했던 프로젝트를 목업으로 보여주는 경우 목업 사이트를 찾지 않고 "Mockup" 플러그인으로 간편하게 제작할 수 있다. 플러그인을 실행한 후 본인이 원하는 목업 이미지를 선택하여 프레임을 추가하면 쉽고 빠르게 목업을 제작할 수 있다. 2. 더미 이미지가 필요한 경우 "Unsplash" 플러그인을 사용하면 빠르게 이미지를 불러올 수 있다. 원하는 주제의 이미지를 Unsplash에서 검색 후 클릭하면 더미 이미지를 바로 추가할 수 있다. 3. 와이어 프레임을 사용하는 경우 "Wireframe Designer" 플러그인을 이용하여 간단한 와이어 프레임 제작이 가능하다. 플러그인을 실행 후 본인이 사용하..
[UX][UI][Product][Figma][Trend] https://ditoday.com/ui-이해하기-인터페이스란-무엇인가/ UI 이해하기 - 인터페이스란 무엇인가 - DIGITAL iNSIGHT 디지털 인사이트 정교한 사용을 위한 UI 이해하기 ditoday.com 인터페이스의 정보 전달 우리가 전자제품을 볼 때 주로 제품의 인터페이스를 평가하곤 한다. '버튼 수가 적어서 조작하기 쉬울 것 같다'라는 말과 같은 의미라고도 생각할 수 있다. 이렇게 디자인에서의 인터페이스는 사용자에게 정보를 제공하는 정보 전달의 측면도 가진다. 하지만 옷이라는 제품을 평가할 때 우리는 '이 옷은 인터페이스가 좋다'라고 이야기하지 않는다. 흔히 말하는 '인터페이스'란 도구나 장치의 속성을 가질 때 좀 더 확실한 의미가..