디자인 스쿨 33기 12

[제로베이스 UIUX스쿨] 5주차 레퍼런스 분석 스터디 : 공차

- 공차 서비스 간단소개지난 주 스터디를 진행했던 스타벅스와 동일하게, 최근에는 대중적으로 이용되고 있는 프랜차이즈 공차의 모바일 어플로,기능 역시 꽤나 유사하게 쉽게 모바일오더를 진행 할 수 있거나, 어플만의 쿠폰, 적립 시스템이 있는 서비스이다. - 공차 어플의 화면 구성* 사용하면서 불편함이 느껴졌던 항목의 넘버표시를 회색으로 표시해두었다.1. 홈 화면1-1. 홈 상단좌측 메뉴가 등장하는 버튼 (주문 화면에 상세)알림 버튼1-2. 홈 메인오더, 주문하기 버튼스탬프 확인 버튼현재 보유하고 있는 쿠폰을 조회하는 버튼나의 모바일 공차카드 확인 버튼상단 바코드 모양 버튼(핸드폰을 흔들어도 등장) 과 동일 화면 출력 2. 주문 화면2-1. 매장 선택 상단뒤로가기 버튼홈화면 1-1, 1번과 동일 역할 버튼홈 ..

[제로베이스 UIUX스쿨] 4주차 아티클 스터디 : UX 리서치에서 태도 기반 연구와 행동 기반 연구

**태도 기반 연구(Attitudinal Research)**와 **행동 기반 연구(Behavioral Research)**는 사용자 경험(UX)에서 서로 보완적인 인사이트를 제공하며, 각각의 접근법은 사용자와의 상호작용을 다양한 관점에서 이해하는 데 도움을 준다.1. 정의태도 기반 연구사용자의 주관적인 경험, 감정, 기대, 선호를 탐구.사용자가 생각하거나 느끼는 이유를 이해하는 것이 목적.설문조사, 인터뷰, 포커스 그룹 등을 통해 자기 보고(self-reported) 데이터를 수집.행동 기반 연구사용자의 실제 행동과 상호작용을 관찰.사용자가 제품을 어떻게 사용하는지 파악하여 데이터를 수집.사용성 테스트, 눈 추적(Eyetracking), 분석 툴, A/B 테스트 등을 사용.2. 태도 기반 연구의 특징무..

[제로베이스 UIUX스쿨] 4주차 레퍼런스 분석 스터디 : 스타벅스

- 스타벅스 서비스 간단소개대중적으로 많이 이용하는 커피전문점 스타벅스의 모바일 어플로, 모바일 주문, md샵, 배달 주문 등여러가지 스타벅스 내 필요한 기능을 처리할 수 있는 어플.어플 주문 시에만 쌓이는 스탬프라던가, 이벤트가 상시적으로 진행되고 있어 스타벅스를 자주 방문하는 고객이라면,반 필수적으로 사용하게 되는 어플이 되어가고 있다. - 스타벅스 어플의 화면 구성 1. 홈 화면1-1. 홈 상단알림 및 공지 확인 버튼쿠폰, 페이, 버디 패스 등 많이 쓰이는 기능들을 모아둔 가로 스크롤 바1-2. 홈 메인현재 진행 중인 프리퀀시(스탬프 이벤트) 배너를 띄워주는 영역진행 중인 프리퀀시가 없을 때에는 2번 항목만 표시 됨현재 진행 중인 메인 프로모션(할인, 신상품 안내 등) 이미지 배너가 띄워지는 영역1..

[제로베이스 UIUX스쿨] 2주차 아티클 스터디 : UI/UX 디자이너 로드맵

- 로드맵 개요해당 글에서 제시하는 로드맵은 총 3단계다. 기초 다지기: 디자인 이론, 인간 행동 등 기본 지식을 습득(약 2~3주 소요).실무 스킬 학습: UI와 UX 모두 학습, 특히 중소기업에서는 두 영역을 모두 다루는 경우가 많음.추가 스킬 확장: 예를 들어, 프론트엔드 개발 또는 No-code 툴 학습.1. 기초 다지기 디자인 이론: 색상, 타이포그래피, 형태 등을 이해.실무에서 바로 사용할 수 있을 만큼만 학습.디지털 심리학: 인간의 디지털 행동을 이해하고, 이를 디자인에 적용.예: “엄지 영역(thumb zone)”에 버튼 배치.관련 리소스: Laws of UX(UX 법칙 모음), 인간 의사결정 방식 이해.제품 디자인: 문제 해결 관점에서 디자인 접근.주요 개념: 디자인 스프린트, 디자인 사..

[제로베이스 UIUX스쿨] 2주차 레퍼런스 분석 스터디 : 몰테일

- 몰테일 서비스 간단소개일본, 미국, 유럽 등 다양한 나라의 쇼핑몰로부터 직구할 때 꼭 필요한 배송대행 서비스 어플.1주차에 레퍼런스 분석을 진행했던 서비스 쉽겟이 이 몰테일 서비스의 파생 어플 개념이다.몰테일 어플 내에서는 배송대행 서비스 외에도 쉽겟과 비슷한 다해줌 서비스도 함께 운영되는 중이고,각종 해외 쇼핑몰의 할인 정보 등도 함께 공유되고 있다. - 몰테일의 화면 구성 1. 홈 화면1-1. 상단바 알림, 장바구니, 상세메뉴 아이콘상품 검색바홈의 카테고리 탭. 허나 쇼핑은 하단바 아이콘 연결 경로와 동일한 쇼핑 페이지 이동, 스토어는 스토어 페이지로 이동하는 등 하단바와 연결 페이지가 겹치는 부분이 많았음. 하단바는 스크롤 중이 아니라면 계속 화면 하단에 붙어있는 형태였기 때문에, 의아한 생각이..

[제로베이스 UIUX스쿨] 1주차 아티클 스터디 : UX 디자인 심리학 - 인간 경험 가이드

- 디자인의 본질아이디어와 디자인은 주제에 대한 깊은 이해에서부터 연결된다고 한다. 예를 들어서, 아이콘은 어디서부터 시작되었는지, 지금에 와서는 어떻게 복잡한 개념, 뜻을 해당 아이콘만으로 쉽게 이해할 수 있게 되었는지 등을 말이다. 핵심은 UX디자이너가 디자인을 선보이는 것이 같은 사람, 인간이라는 점에서 인식과 경험을 이해하는 것이 중요하다고 느끼고 있다고 한다.- UX의 정의와 인간 중심 디자인 UX, 사용자 경험은 사람들마다 생각하고, 해석하는 바가 다르지만 저자는 도널드 노먼 교수가 정의한 대로 [ 인간이 실제로 경험하는 방식을 이해하는 것 ]이라는 것이 가장 와닿았다고 한다. 그럼 그대로 받아들이자면, 심리학은 매우 유용한 도구가 되고, 이것을 이용해 더 인간적인 제품을 만들었을 때 더 즐거..

[제로베이스 UIUX스쿨] 1주차 레퍼런스 분석 스터디 : 쉽겟

- 쉽겟 서비스 간단소개[ 국내쇼핑처럼 쉽고 간편한 해외직구 ] 라는 캐치프레이즈를 내세우고 있는 쇼핑어플.중국의 쇼핑몰인 타오바오, 징동닷컴 이외에도 일본, 미국의 쇼핑몰 상품들도 어플 내에서 주문하기만 하면,보통 다른 나라에서 직구할 때 필요한 공정을 어플 내에서 대신 진행하여 한국까지 배송해주는 서비스이다. - 쉽겟 화면 구성과 감상 정리1. 홈 화면홈 화면은 타 쇼핑어플과 비슷하게 장바구니와 검색바, 프로모션 공지이미지, 추천 상품들이 보이는 구성이였다.외국 쇼핑몰의 구매대행이 목적인 어플이니만큼 상품의 이름이 원어 그대로 표시되는 경우가 있어타 쇼핑몰 구성에서는 보기 힘든 7번 항목의 [페이지 번역]버튼이 따로 마련된 것이 인상적이였다. 다만 우측 하단에 위치한 [최근 본 상품], 상단 바로가기..

[제로베이스 UIUX스쿨] 1주차 과제(2) : 나의 UX 디자인에 대한 정의

- UX디자인이란?사용자가 제품, 서비스 혹은 시스템을 사용하거나 체험하는 데 있어지각하는 것이 가능한 조직적 상호교감적인 모델을 창조하고 개발하는 디자인의 한 분야  UX디자인에 대해 검색하면, 사전적 의미로는 이렇게 정의되고 있다.살짝 어려운 단어가 포함되어 있긴 하지만, 내가 이해하고 있는 UX 디자인의 정의와 크게 다르지 않다고 생각했다. - 내가 정의해보는 UX디자인그래서 내 생각을 작성해보자면, 한 마디로 서비스 니즈에 맞춘 화면과 기능을 구성, 제작하는 분야 라고 생각한다.거기에 사용자 편의성, 디자인(보이는 부분)이 추가적으로 함께 고민할 요소로서 포함되지 않나 싶다. 예를들어, 많이들 사용하는 서비스인 유튜브가 이런 구글과도 비슷한 화면이라면 어떨까?누가봐도 영상 공유 서비스라고는 느끼지..

[제로베이스 UIUX스쿨] 1주차 과제(1) : 생활 속 UX 개선사례 찾아보기

- 생활 속 UX 개선사례 : 우리은행 (및 타사은행 어플)이전 코로나19의 장기화 여파와 IT 통신 기술의 발달로 인해 모바일 뱅킹의 사용자가 많아지면서,오프라인 은행 점포가 조금씩 폐쇄 되어가고 있다. 다만 아직까지도 오프라인 은행을 이용을 선호하는 고객층이 있는데, 그것이 바로 고령층이다. 조사에 따르면 은행 고객 중 60대 이상 고객은 21.2%, 모바일뱅킹 이용자 중 60대 이상 고객은 10.3%로다른 연령층에 비해 상대적으로 낮다고 한다. 이런 상황이 지속될 것을 우려해 금융당국에서 금융접근성을 높히고자 22년 2월 [ 고령자 친화 모바일 금융앱 구성지침 ]을 발표했고, 23년 6월말 각 은행어플에 모두 해당 지침이 적용된 고령자모드를 출시했다.- UX 개선점기존 홈의 좌측 상단에 있는 [ 쉬..

[제로베이스 UIUX스쿨] 1일차 학습일지 : XD를 사용해 요소만들기

1.  오늘 배운 것딱 한 번 만져본 경험만 있는 Adobe XD를 사용해 다양한 기본 UI 오브젝트들을 만들어보는 시간을 가졌다.미처 예습을 못해서 따라가는데에 많이 오래걸릴까 걱정을 했는데, 다행이도 애니메이트나 피그마 등 아는 프로그램과UI가 그렇게 많이 다르지 않아 수월하게 진행되었던 것 같다. 새로운 프로그램은 늘 시작이 재밌다! 대부분 아는 내용이고 복습하는 느낌이였는데, 내내 따라 만들며 중요하게 느낀 부분은 이 점이다. 1. 만들 때부터 디자인 규격을 설정하고, 꼭 지킬 것 (상하좌우 공백 등)2. 벡터아이콘 제작 시 병합을 너무 남발하지 않기3. 버튼이나 텍스트박스 등 재사용할 여지가 있는 오브젝트들은 최대한 수정이 용이하도록 하기 평소에는 중요하지...~ 정도로만 인식되었던 것들인데, ..