[Creative] Figma 개인과제_디자인 시스템 및 프로토타입 제작 #1 Assignment▼ 디자인 시스템 및 프로토타입 제작 ❑ 와이어프레임이커머스 컨셉 및 브랜드 색상 구상사용자 시나리오를 참고하여 와이어프레임을 제작.UI설계 ❑ 컬러 스타일제품의 컬러를 선정(Primary, Secondary, Tertiary)컬러 팔레트화 ❑ 폰트 스타일폰트 스타일 선정폰트 스타일 도큐먼트화 ❑ 레퍼런스 UI 분석이커머스 레퍼런스 자료 서칭이커머스 UI 비교 분석 ❑ Flowchart 수정 및 설계Flowchart 수정 및 재설계 ❑ UI 디자인UI디자인 ❑ 디자인 시스템 or UI KitUI KitUI or 엘레멘츠 컴포넌트화 ❑ Lo-fi 프로토타입프로토타입 작업 [Design] 디자인 입문 개인과제_문제 정의, 솔루션 도출 #1 Assignment▼ [11번가 App] 문제정의, 솔루션 도출 ❑ 문제 정의 ▷ 페르소나 : 할인쿠폰 광고를 보고 처음 이용하는 고객오프라인보다 이커머스를 이용하는 고객이 늘어났고 차별화를 위해 익일, 새벽 배송, 다양한 이벤트 등 바쁜 현대인들에게 중점을 두고 분석하였다.상품 콘텐츠를 보는 것이 아닌 실질적으로 제품을 구매해야 하며, 아마존과의 전략적 제휴 맺음으로 다양한 이벤트들을 하나의 App으로 유입함으로 깔끔하고 심플함이 주목적일 것으로 사료되었다.그렇다면 나와 같이 네이버, 쿠팡에 익숙한 사람들을 유입하려면 어떠한 접근이 필요할까 하여 '할인쿠폰 광고를 보고 처음 이용하는 고객'으로 페르소나를 정하고 이를 분석해 보았다. ▷ 문제 정의처음 이용하는 고객은 무엇을 먼저 클릭해야 할.. [Design] 디자인 원칙의 실제 사례 찾아보기 #1 Homework▼ 디자인 원칙의 실제 사례 찾아보기 ❑ 게슈탈트 심리학 관점 실제사례근접성의 원리 The law of proximity- 가까운 것끼리 묶어서 지각하려는 경향 폐쇄성의 원리 The law of closure- 공백이 있더라도 틈이나 간격을 메워서 닫힌 형태로 인식하려는 경향 연속성의 원리 The law of continuance- 연속적으로 직선이나 곡선을 이루는 요소를 잘 인지하는 경향 ❑ 게슈탈트 심리학 관점 실제사례스케일 Scale- 상대적인 크기를 사용하여 구성의 중요도와 순위를 표시하는 것을 말함시각적 위계 Visual hierarchy- 중요한 순서에 따라 시선의 흐름이 이동하도록 디자인하는 것을 말함대비 Contrast- 눈에 띄게 구별되도록 강조하기 위해 두 요소 .. [Creative] 피그마로 간단한 프로토타입 만들어보기 #1 Homework ▼ 피그마로 프로토타입 만들기 ▽ 와이어프레임 or Figma 프로토타입 도안 ▽ Lo-fi Protofype 피그마 구동 [Design] 디자인씽킹을 활용하여 개선 아이디어 도출하기 #1 Homework ▼디자인씽킹을 활용하여 개선 아이디어 도출하기 ▽ 어플 '스카이스캐너' ▽ 1단계 공감하기_공감지도 (Empathy Map) * 6가지 주요영역사용자가 생각하고 느끼는 것은 무엇인가?- 여행일정변동, 편리한 예약어플, 한 눈에 보이는 일정표 등사용자에게 들은 내용은 무엇인가?- 편리하고 사용하기 쉬운 여행 어플 or 여행일정에 도움이 되는 어플 등사용자가 보고 있는 것은 무엇인가?- 여행객, 여행을 하고픈 기념 or 휴일사용자가 주로 말하고 행동하는 것은 무엇인가?쉽게 어플을 사용할 수 없을까?, 예약, 렌트카 등등 한 어플에서 해결할 순 없을까?사용자의 불편점은 무엇인가?따로따로 예매해야하는 불편함, 쉬운 어플이 없다는 불편함, 한 눈에 관리가 안되는 불편한 사항들.. [Creative] 웹사이트 클론 디자인 #1 웹 서비스 선정▽ VOD 스트리밍 OTT Service ‘넷플릭스’ Main View주로 OTT 서비스인 ‘넷플릭스’를 스마트 기기인 모바일앱 버전이 아닌 데스크탑 버을 이용한다. 자주 봐왔던 화면인 만큼 해당 서비스 화면을 따라 만들고 싶은 생각이 들어 이번 클론 디자인으로 택했다.#2 작업물 소개첫 프로필 화면에서는 다른 정보와 방해되는 요소들이 없이 오로지 프로필 부분에서만 초점을 주었기 때문에 깔끔한 UI가 인상적이다.메인화면에서는 Black & White 색상을 이용하여 배경과 콘텐츠들을 시각적으로 표현을 했고, 사용자가 알아야할 중요한 정보는 Red 색상을 통해 중요한 포인트들을 심어주었고 전체적으로 깔끔하고 버릴 것 없는 디자인이라는 것을 보여준 UI였다.#3 유저 플로우 해당 유저 플.. [Design] 이마트몰 앱 서비스 홈 화면 분석 #1 서비스 선정▼ 선정 이유평소 내가 자주 사용하면서 UX가 뛰어나다고 생각했던 앱으로 생각을 해보니 이커머스와 SSG이 생각이 났다. 신세계 BI와 퀄리티 좋은 비쥬얼과 서비스가 한 곳에 모여 SSG이라는 브랜드를 론칭해 많은 도움이 될 것 같아 해당 어플을 선정해 보았다.▼ 서비스 소개SSG은 신세계그룹 산하 법인의 온라인 부문을 통합한 쇼핑몰과 이를 운영하는 기업이다. 해당 서비스를 쉽고 간편하게 새벽배송 및 익일배송으로 받아볼 수 있으며 **’공효진&공유’**의 TV광고로 많은 사람들에게 사랑 받고 있는 이커머스 서비스이다. #2 UI/UX 디자인 분석▼ 화면 구성처음 이마트몰 앱을 실행하면 SSG의 아이덴티티가 느껴지는 노란색 색감에 메인 슬라이드 화면에는 인터랙션 영역으로 사용자와 상호작용하.. 이전 1 다음