UXUI (97) 썸네일형 리스트형 [TIL] 24/06/26 디자인 스낵타임 A 웹에서는 검색창이 상단에 있으니 앱에서도 상단에 위치하는 것이 사용자에게는 A가 더 익숙할 것 같다. (제이콥의 법칙)B 사용자가 터치해야 하는 대상은 가까울수록 사용성이 좋기 때문에 B를 선택했다. (피츠의 법칙)사파리가 A→B로 바뀌었는데 처음엔 어색했지만 A를 누를 땐 상단을 클릭하기 위해서 손가락을 올려야 하는 번거로움이 있었는데 익숙하다 보니 번거롭다고 인지하지 못했다. 하지만 B로 바뀌고 난 후에는 한 손으로도 움직일 수 있어 전보다 훨씬 편하다.회의 후 느낀점 아이패드도 사파리에서 검색창이 상단에 있는 것으로 봐서, 갤럭시 폴드처럼 디바이스 크기가 크고 한 손이 아닌 양손을 사용해야 될 때는 A가 편하다.B는 스크롤을 내릴 때 실수로 누를 수도 있다. 만약 실수로 주소 검.. [아티클스터디] 그래도 해지하실 거예요? 15화 10분 만에 읽는 좋은 탈퇴 UX 전략서비스 평판은 탈퇴 과정에서 정해진다? | 사용자 경험 디자인에서 회원 탈퇴는 온보딩만큼이나 중요합니다. 사용자의 자율성을 심리 트릭으로 조정하려는 다크 패턴의 부정적 인식이 확산된 brunch.co.kr 회원 탈퇴 시 사용자는 번거로운 과정 없이 빠르게 떠나고 싶어 하고, 서비스는 탈퇴율을 최소화하며 사용자의 탈퇴 이유에 대한 정보를 수집하고 싶어 한다. 회원탈퇴 시 어떤 UX전략을 수립하는 것이 좋을까? 위 아티클을 읽고 인사이트를 정리해 보았다. 다크 패턴(Dark Patterns) 이용자들이 물건을 구매하거나 서비스에 가입하도록 유도하기 위해 업체가 의도한 웹이나 앱의 설계 또는 디자인 ex. '멤버십 혜택 포기하기', '불편하지만 웹으로 보기' 서비스.. [TIL] 24/06/25 디자인 스낵타임 A음식 사진을 제공해 사용자에게 메뉴를 직접적으로 보여주기 위해서B처럼 가게 상세페이지로 들어가 메뉴를 확인하지않고 음식점 리스트에서 메뉴를 바로 확인할 수 있어 편리하다.B음식점 브랜드와 정보가 눈에 띄게 한다.화면에서 더 많은 정보를 한꺼번에 볼 수 있게 한다. 회의 후 느낀점 A가 메뉴를 크게 보여줘서 클릭을 유도하기 좋다.B는 리스트를 더 많이 보여줘야 하는 카테고리 내에서 좋다. 배달 어플에서의 음식점 리스트 제공 어떤 이유로 보여주는 형태가 다를까요? | 디자이너스배달 어플에서의 음식점 리스트 제공 어떤 이유로 보여주는 형태가 다를까요?designus.io 일일 회고 오전에 노트북 충전이 안되길래 살펴보니까 충전기가 고장 났는지 충전이 안 됐다. 고치려고 노력해 봤는데 연결 부.. [TIL] 24/06/24 디자인 스낵타임 A댓글 정렬 방법 태그칩이 눈에 잘 띈다.버튼을 누르면 정렬 방법이 바뀌어서 B보다 선택이 용이하다.댓글 타이틀 바로 밑에 태그칩이 있어 시각적 위계가 잘 드러난다.BA는 버튼을 한 번만 눌러도 되는데, B는 정렬방법을 선택하려면 리스트 선택→바텀시트로 한번 더 클릭을 해야 한다.댓글 정렬 방법을 바꾸려면 다시 리스트 선택 후 바텀시트 화면에서 클릭해야 하기 때문에 피로감이 느껴진다. 회의 후 느낀 점댓글은 스크롤을 계속 내리게 되니까 즉각적으로 선택할 수 있는 칩형태가 좋다.B는 탭을 눌러서 페이지를 선택하는 게 불편하다는 의견항목이 3가지뿐이라 굳이 바텀시트를 사용하지 않아도 될 것 같다사용자가 즉각적인 소팅 액션을 원한다면 A댓글 정렬을 바꿔가며 보기보다 제시한 정렬(ex. 인기.. [디자인입문] 개인과제 회고 UX/UI 디자인 입문 강의 목표- UX/UI가 무엇인지 이해하고, 제품을 체계적으로 만드는 프로세스를 배웁니다.- 제품을 논리적으로 설계하기 위해 필요한 과정을 머릿속에 그릴 수 있고, 각 단계에 필요한 것을 스스로 설정할 수 있습니다.과제 목표- UX/UI 디자인 입문 강의에서 배운 내용을 종합적으로 활용해 제품을 논리적으로 설계하는 능력을 기릅니다.- 디자인씽킹의 5단계를 각각 이해하고, 적용할 수 있습니다. - 다양한 디자인 원칙을 근거로 탄탄한 솔루션을 설계할 수 있습니다. AEIOU 관찰법으로 음식배달/외식 서비스에 대해 찾아볼 때 어떤 주제로 자료조사를 진행해야 할지, 어떤 주제로 자료조사를 진행해야 할지 고민을 많이 했다. 일단 외식 서비스 보다 음식 배달 어플을 더 자주 사용하기 때문에 .. [아티클스터디] 레퍼런스 적용 시 주의할 점 독이 되는 레퍼런스 활용법매혹적이지만 독이 될 수 있는 레퍼런스. 어떻게 활용하는 것이 좋을까요?toss.tech 레퍼런스를 활용한 이동수단 서비스를 개선하게 된 과정이 담긴 아티클이다. 이 아티클을 분석하고 인사이트를 정리해 보았다.Question Every Assupmtion으로 디자인하기1. 모든 요소와 스펙에 꼭 필요한지 질문하기, 모르겠다면 유저 만나보기2. 화면에 갇히지 말고 화면을 보는 사용자의 상황 상상하기3. 매 순간 가장 중요한 건 뭘지 질문하기4. 개선한 화면 꼭 검증하기 인사이트 정리 기존에 많이 활용되는 사용자 경험을 보고 사용자가 무엇을 원하는지 고민해 보기문제 파악, 가설 만들고 검증하기, 해결하는 방안을 나눠 생각해 보기레퍼런스와 최종 디자인을 나란히 배치하고 퍼센트 같은 객.. [WIL] 24/06/21 디자인 스낵타임 A장점: 시각적 위계가 잘 표현되어있어 보기 편하고, 화면에 ‘예약 정보’ 하나의 정보값만 입력할 수 있어 의사결정 시간이 줄어든다. (힉의 법칙)텍스트의 크기 차이로 시각적 위계가 잘 표현되어있다.‘1/2단계’, ‘다음’ 버튼을 통해 다음 단계가 있다는 것을 사용자가 인식할 수 있다.B장점: 한 화면 안에 예약 정보, 결제 정보를 같이 기재할 수 있다.‘예약 정보’, ‘결제 정보’ 타이틀 텍스트의 크기가 좀 더 커서 시각적 위계를 나타냈으면 좋겠다. 회의 후 느낀 점A는 단계가 나뉘어 있어 피로감이 덜 느껴진다는 의견A는 단계가 많다면 수정 시 계속 뒤로 가기 버튼을 눌러야 해서 단계가 적을 때 유용할 것 같다.B는 입력해야 하는 정보가 많을 때 한눈에 볼 수 있고, 수정할 때도 편리하.. [TIL] 24/06/20 디자인 스낵타임 A남은 데이터가 0%, 100%에 가까워진다면 텍스트가 겹칠 것 같다.B한눈에 보기 좋고 깔끔하다.A와 B를 비교해 보니, 수치를 대략적으로 파악할 때는 바 형태보다 원형이 적합한 것 같다.원형으로 수치를 나타내는 대표적인 예로 시계가 있는데, 시계는 숫자도 같이 보여주기 때문에 원형만 봐도 대략적으로 수치를 알 수 있다. 회의 후 느낀 점B안은 남은 데이터만 보여주기 때문에 전체 데이터가 얼마인지 파악하기 어렵다.B안은 폐쇄성의 원칙이 잘 드러난다.시각적으로 수치를 쉽게 파악할 수 있다는 것도 중요하지만 데이터라는 속성을 어떻게 표현할지 고민해봐야 할 것 같다. 예를 들어, 데이터는 한 달이 지나면 다시 충전되는 것, 잔여데이터와 사용데이터 중 어떤 것이 고객 입장에서 좋을까 등이 있.. [강의학습일지] Figma 활용법(2) 3주차 강의 프로토타입 실제 제품을 만들지 않고 아이디어를 테스트해 볼 수 있는 것Lo-fi(Low/High): 전체 흐름을 빠르게 맞춰볼 수 있는 수준. 와이어프레임. 피그마는 Lo-fi를 만드는데 특화됨Hi-fi(High Fidelity): 실제 제품과 거의 같거나 유사한 수준(사용자 대상으로 사용성 테스트, 제품 피드백 수집 가능)프로토타입을 만들거나 사용해 테스트하는것을 프로토타이핑이라고 함프리뷰 모드: Shift+Space문장으로 이해하면 편함: ~하면(조건,트리거) 어떻게(애니메이션) ~한다(액션) 1) 핫스팟(Hot Spot): 프로토타입을 시작하는 지점인터랙션(Interaction)에서 +를 클릭해도 OK 2) 커넥션(Connection): 화면을 서로 이어주는 연결선 3) 종착점(Destinatio.. [TIL] 24/06/19 디자인 스낵타임 A통화 거절/수신이 있어서 고민 없이 사용자가 원하는 선택을 할 수 있다.B슬라이드 형식이라 버튼이 잘못 눌리는 경우를 대비할 수 있다.화면에 통화 거절 버튼이 없어 사용자가 당황할 수 있다.회의 후 느낀점A 화면은 버튼을 끝까지 눌러야 해서 불편했다는 팀원의 의견이 있었다.휴대폰을 사용하는 도중에는 A로, 잠금상태일 때는 B로 떴는데 현재 A는 상단 팝업 알림 형태로 뜬다.주머니 속에 핸드폰을 넣어뒀을 때 실수로 버튼이 눌리는 경우가 종종 있는 것 같다. 전화 받기 방식 어떤 것을 선택하시겠어요? | 디자이너스전화 받기 방식 어떤 것을 선택하시겠어요?designus.io Figma 활용법 (2) 2주차 숙제 와이어프레임 라이트박스를 60% 했는데 컴포넌트가 있어서 그런지 전체 화면이.. 이전 1 2 3 4 5 6 7 8 ··· 10 다음
