본문 바로가기
웹 서비스 분석 및 개선 아이디어 (넷플릭스) 웹 서비스 선정: 넷플릭스선정 이유: 제일 자주 사용하는 앱이지만 가끔 불편함을 느껴서 선정했다.서비스 소개: 시리즈와 영화를 인터넷 연결 지원 디바이스에서 시청할 수 있는 멤버십 기반 스트리밍 서비스이다. UI/UX 디자인 분석  인상 깊은 기능1. 영상을 보다가 밝기 조절을 쉽게 할 수 있어서 편리하다.2. 출연자의 이름을 클릭하면 배우의 필모그래피 페이지로 연결된다.   개선 아이디어1. 가끔 찜하기, 취소가 제대로 작동이 안 될 때가 있다. 2. 시작 화면이 New & Hot으로 연결되어 있는 게 불편할 때가 있다. 보통 사용자들은 본인들이 이미 보던 시리즈나 영화를 이어보려고 할 텐데 첫 화면부터 찜한 콘텐츠와 시청 중인 영상이 뜨면 편할 것 같다. 3. "홈"과 "나의 넷플릭스"가 분리가 잘 .. 2024. 2. 6.
피그마 강의 3주차 숙제 (프로토타입) 2024. 2. 6.
게임 속 팝업 버튼 UX 디자인 좋은 예, 나쁜 예 게임에는 수 많은 팝업이 뜨기 때문에 팝업이 전달하는 내용과 예측되는 사용자의 행동에 따라 팝업의 구조 또한 각각의 상황에 맞게 다르게 디자인 되어야 한다. 서비스 제공자 입장에서 사용자가 와주었으면 하는 루트를 사용자에게 헷갈리지 않고 명확하게 전달 할 수 있어야 한다. 나쁜 예시와 좋은 예시 모두 정리해보았다.[게임 디스라이트의 팝업]버전이 오래되어 새로운 패치를 다운로드 받아달라는 팝업서비스 제공자의 입장에서는 취소 버튼을 누르고 앱을 이탈해버리면 손해인 상황이기 때문에 취소 버튼을 삭제하고 확인 버튼만 남기는 것이 좋겠다.[게임 일곱개의 대죄의 팝업]아니오 버튼이 있지만 막상 아니오 버튼을 눌러도 다시 같은 팝업이 뜬다.이 또한 아니오를 없애고 예만 남기면 좋겠다.[게임 카트라이더의 팝업]누를 수.. 2024. 2. 5.
클론 디자인 (애플) 애플 공식 페이지 한 부분을 그대로 만들어보았다. 제작 소요 시간1시간 30분 제작 순서1. 줄자로 간격 따기2. 맨 위에서부터 타이핑과 아이콘들을 넣어가며 제작하기3. 간격 조절에 용이하게 오토레이아웃으로 묶어가며 제작하기4. 오늘은 마스터 컴포넌트 기능도 사용했다.        오토레이아웃을 만들어서 작업하던 중 중간에 공백이 많이 필요했다.구글에 찾아보니 Currently the only 2 ways to add spacing is to: Create a spacer element or. Wrap the items in another frame and apply gap spacing. 라는 방법을 찾았다.              반복되는 요소들은 마스터 컴포넌트 기능으로 먼저 제작을 하고,변경사항이.. 2024. 1. 31.
더블 다이아몬드 모델 (리서치에 대해서) 인터뷰의 목적과 좋은 질문이 무엇인지, 인터뷰 전 준비해야 할 사항, 인터뷰 진행 방법에 대한 글이다. 글쓴이가 참고한 책- 사용자의 숨겨진 마음을 읽는 리서치 기술- 이것이 UX/UI 디자인이다  인터뷰의 종류에는 두가지가 존재한다.1. 필드 리서치: 인터뷰 리서치를 의미한다.2. 데스크 리서치: 문헌이나 리포트 자료를 통해 시장 동향, 경쟁사 조사, 트렌드 동향 하는 리서치를 의미한다.  리서치에 대해 배우려면 먼저 UX 방법론 중 하나인 더블 다이아몬드 모델에 대해 배워야 한다.  더블 다이아몬드 모델UX 방법론으로서, 서비스 기획에 자주 사용되는 프레임워크이다. 유저 경험 측면에서 문제를 밝힌 다음, 솔루션(서비스)를 디자인한다.왼쪽에서 오른쪽으로 가는 수순이다. 1. Discover: 발견 단계.. 2024. 1. 31.
클론 디자인 (토스) 컴포넌트 (Component)란 프로그래밍에 있어 재사용이 가능한 각각의 독립된 모듈을 뜻한다. 정보를 여러가지로 묶어서 보여주기보다 컴포넌트 기반 프로그래밍을 통해 레고 블록처럼 조합된 화면을 구성해서 보여주면 구분하기 쉽고 눈에 더 잘 들어온다. Component는 한국말로 : 요소    토스 앱의 한 화면을 그대로 만들어보았다. 제작 소요 시간2시간 30분 제작 순서1.  줄자로 간격 따기2. 맨 위에서부터 타이핑과 아이콘들을 넣어가며 제작하기3. 리소스 플러그인에 없는 아이콘은 직접 도형으로 만들기 (검은색 고양이.. 등등 )4. 간격 조절에 용이하게 오토레이아웃으로 묶어가며 제작하기          똑같이 만드는 건 시간만 투자하면 되니 어렵진 않았다. 하지만 내가 잘하고 있는 건지 확인받을 곳.. 2024. 1. 30.
사전캠프 2주차 WIL 지난주 사전캠프를 시작으로 일주일 반이 지났다. 저번주는 사전캠프에서 사용하는 노션, 데일리미션등을 이해하고 적응하느라 많은 시간을 보냈었다. 그리고 이번주는 디자인 아티클 스터디와 JD분석 그리고 피그마 강의를 들으며 한 주를 보냈다. UI/UX 외에도 비슷한 직무에 대해 공부했고, 기업들이 어떤 사람을 채용하고 싶은지에 대해 알게 되었다. 리서치를 하다 보니 조금씩 생기는 두려움.. 나는 대학교를 나오지 않았는데도 괜찮을까? 나중에 채용이 안되면 어쩌지? 채용이 돼도 페이가 너무 적으면 어쩌지? 이런저런 고민들이 생기면서 나 스스로 작게 느껴졌다. 과거의 선택들이 후회가 되며 자신이 없어졌다. 그러다가 문득 책상에 프린트 해둔 데일리 미션 1달치 차트를 보게 되었다. 아, 나 아직 1주차구나..? 그.. 2024. 1. 26.
UI/UX 디자이너의 핵심 역량 정리 1. 기업들이 요구하는 핵심 역량디자인 기술과 경험심미적이고 편리한 디자인을 구현해 내기 위한 기술과 그만큼의 경험이 있어야 한다. 사용자 중심 디자인사용자 경험을 개선하기 위해 사용자 중심 디자인 원칙을 이해하고 적용할 수 있는 능력이 중요하다.창의적이고 열린 마음으로 문제를 바라볼 줄 알아야 한다. 커뮤니케이션 스킬효과적인 의사소통이 가능해야 하고, 디자인 의도를 팀과 이해하기 쉽게 전달할 수 있어야 한다. 협업 능력다양한 팀과 조직 내에서 협업할 수 있는 능력이 필요하다.다양한 전문가들과 조화로운 협력을 할 수 있어야 한다. 문제 해결 능력디자인 과정에서 발생할 수 있는 문제에 대한 창의적이고 효과적인 해결 능력이 요구된다. 디자인 툴 활용 능력피그마, 일러스트, 포토샵 등 디자인 툴을 능숙하게 사.. 2024. 1. 25.
UX 디자인으로 인지 부하 줄이는 방법 사용자는 웹사이트나 앱을 사용할 때 다양한 정보를 처리하고 결정을 내리는데 상당한 인지적 노력을 하게 된다.UX 디자인을 통해 메이커는 최소한의 인지 비용을 쓸 수 있도록 해야 한다. 인지 부하란? (Cognitive Load)사람의 두뇌가 정보를 처리하고 이해하는데 드는 정신적 노력의 양을 말한다.인간의 두뇌는 한 번에 처리할 수 있는 정보의 양에 한계가 있는데 인지 부하란 이 한계를 넘어 정보가 너무 많거나 복잡할 때 발생한다. 인지 부하를 줄이는 방법1. 간결함과 명확성 (Simplicity and Clarity)불필요한 요소와 디자인을 제거하고 핵심 기능에 집중하여 디자인을 간단하고 명확하게 유지해 사용자가 이해하기 쉽게 한다. 2. 직관적인 내비게이션 (Intuitive Navigation)명확.. 2024. 1. 24.

티스토리툴바