TIL (Today I learned)
오늘 나는 무엇을 했나요
- 아티클 스터디 - (게임 속 팝업의 버튼 UX 디자인 좋은 사례와 나쁜 사례)
- 내가 생각하는 프로덕트 디자이너의 핵심 역량조사
- 피그마 강의 - 프레임 리사이징 (Fill Hug Fixed)
오늘은 어떤 것을 배웠나요
1. 아티클 스터디 - (게임 속 팝업의 버튼 UX 디자인 좋은 사례와 나쁜 사례)
게임 속 팝업의 버튼 UX 디자인 좋은 사례와 나쁜 사례를 살펴보고 버튼 하나하나가 미치는 영향을 배웠습니다.
게임속 팝업의 버튼은 다양합니다. 업데이트창의 버튼, 이름짓는창의 버튼 등등
하지만 버튼 하나하나가 중요한 부분을 차지한다는것을 알게됨
다음과 같은 업데이트 창은 나쁜 사례입니다. (일곱개의 대죄)
이유는 다음과 같습니다.
1.먼저 아니오나 취소버튼을 누를시, 게임이 꺼지거나 업데이트창이 다시 뜹니다. 이럴경우 쓸모 없는 기능을 넣은셈입니다.
2.취소 버튼을 굳이 만들어서 업데이트 유도를 방해하고 있습니다.
닫기 버튼을 없애면 사용자 경험에 어떤 영향을 줄까?
1. 닫기 버튼이라는 어포던스를 시각적으로 제거했다. 이로 인해 팝업에서 더 중요한 정보와, 게임을 하며 수행해야 할 행동에 온전히 집중할 수 있게 된다.
2. 닫기 버튼이 보이지 않음으로써, 딤드 영역이 닫기 기능을 전담한다. 이는 빠른 인지와 결정을 도와 사용자가 인지 에너지를 아낄 수 있도록 해주며, 손의 접근이 편리해져 사용성을 향상시킨다.
위와 같은 업데이트 창을 좋은 사례로 만들어 보면
여기서 문구도 바꾼다면 (제2의 나라)
이런식으로 업데이트를 해야하는 이유를 설명하면서 ? 보다는 ! 로 강조한다면 업데이트 유도에 더 도움이 될것입니다.
또한 "예" 버튼 대신에 "이동"으로 바꾸어서 사용자에게 더욱 구체적인 표현을 사용한다면 혼란이 안 일어날 것입니다.
2. 내가 생각하는 프로덕트 디자이너의 핵심 역량조사
주로 신입이나 경력이 적은 사람을 원하는 회사를 정하여 조사를 했습니다.
내가 생각하는 프로덕트 디자이너의 핵심 역량조사
내가 생각하는 프로덕트 디자이너의 핵심 역량을 조사 하였고,
주로 신입이나 경력이 얼마 없는곳을 원하는 회사를 정하여 조사를 하였다.
1. 요구사항
- 누비랩
- • 기획 및 아이데이션 참여도/참여 의지가 높은 디자이너 분
• Web, Android 등 다양한 플랫폼에 대한 이해가 있으신 분
• 목표 달성을 위해 원활하게 커뮤니케이션 하며 동료를 설득할 수 있으신 분
• 고객이 원하는 것을 다각도로 파악하고 주도적으로 디자인을 진행하시는 분
• 빠르게 아이디어를 구체화하여 팀원들과 공유하시는 분
• 다양한 디자인 툴을 활용하여 문제를 해결하고 시각적 완성도를 높이시는 분 - 우대사항
- • 신입도 무관하나, 관련 경력 3년 이상이신 분
• 디자인 전공(디지털 미디어 디자인, 시각 디자인, 인터랙션 디자인 등)
• 하나의 제품 안에서 여러 사용자 그룹을 대상으로 하는 서비스 디자인 경험
• 유아 및 청소년을 위한 제품 디자인 경험이 있으신 분
• 3D 그래픽 디자인 경험이 있으신 분
• 디자인 시스템 구축 혹은 활용 경험
- • 기획 및 아이데이션 참여도/참여 의지가 높은 디자이너 분
- 위버스컴퍼니
- • 학력 무관
• 전공 무관 (시각디자인 전공 우대)
• 신입 혹은 1년 이상 3년 이하의 Mobile / Web을 포함한 UX/UI 디자인 경험이 있는 분
• UI 디자인툴을 능숙하게 사용할 수 있는 분 (Figma) - • 유려한 UI 디자인 및 컴포넌트 제작 능력
• 긍정적이고 적극적으로 이슈를 해결하는 주도성
• 논리적이고 체계적인 사고를 통한 UI 도출 능력
• 상대방의 니즈를 파악하고 이에 맞추어 대응할 수 있는 고객 지향성
• 미션과 목표를 달성하기 위해 어려운 상황에서도 결과를 만들어 낼 수 있는 끈기 - 우대사항
- • 위버스 서비스를 이해하고 더 나은 사용자 경험을 제시할 수 있는 분
• 개발에 대한 이해를 바탕으로 구조적인 UI 디자인 역량을 보유한 분
• 일관된 아이콘, 그래픽 디자인 역량을 보유한 분
• 인터랙션 프로토타입을 구현하여 디자인 시안 제작이 가능한 분
• 프로젝트 출시 경험이 있는 분 (플랫폼 무관)
• 기획, 개발 및 협업 부서와 원활한 커뮤니케이션을 바탕으로 디자인 프로젝트를 진행할 수 있는 분
- • 학력 무관
- 버터소프트
- • Figma, Wireframe, UI/UX 디자인 스킬
• 다양한 디자인 도구 및 소프트웨어를 능숙하게 사용할 수 있는 분
• 성능 최적화와 디자인 자동화를 위한 지속적인 노력을 할 수 있는 분
• 부드러운 커뮤니케이션, 협업 능력
• 주도적인 태도 - 우대사항
- • 그래픽 디자인 또는 관련분야 전공
• 앱 / 웹 / 백오피스 서비스 구축 경험이 있는 분
• 서비스 기획에 대한 이해와 경험이 있는 분
• 스타트업 근무 경험이 있는 분
• 사용자 데이터를 분석하고 모니터링하여 서비스 개선에 활용한 경험을 제공할 수 있는 분
• 빠르게 변하는 디자인 트렌드를 이해하고 적용할 수 있는 능력
- • Figma, Wireframe, UI/UX 디자인 스킬
2. 핵심 역량 키워드
- 피그마
- 협업, 커뮤니케이션
- 고객 지향성
- 다양한 플랫폼 이해
- 논리적이고 체계적인 사고
3. 내가 생각하는 핵심 역량
- 피그마를 능숙하게 사용할 수 있다.
- 협업, 커뮤니케이션 스킬이 뛰어나다.
- 고객 지향적인 디자인
- 논리적 사고를 바탕으로 UI/UX 디자인을 도출 할 수있다
4.프로덕트 디자이너는 어떤 일을 하는 사람일까
프로덕트 디자이너는 사용자 경험(UX)과 인터페이스(UI) 설계를 통해 사용자 문제를 정의하고, 이를 논리적이고 창의적인 디자인 솔루션으로 해결하며, 다양한 팀과 협업하여 제품을 기획하고 개선하는 과정을 주도한다고 생각함
5. 나의 다짐
프로덕트 디자이너가 되기 위해서는 핵심 역량을 먼저 빠르게 키워야한다고 생각함.
그러기 위해선 부트캠프를 하면서 얻는 지식에서 멈추지 않고 나 혼자 스스로 자습을 하면서 역량을 키워나가야함.
또한 관련자료를 찾아보면서 디자인에 대한 지식을 쌓는것도 해야함
내가 현재 잘하는것은 디자인툴(피그마)의 기본적인 사용방법을 배우며 피그마 클론공부를 하는 중이고
부족한 부분은 대학이나 평소에 디자인같은 공부는 안했기 때문에 디자인부분의 개념?공부를 더 해야한다.
3. 피그마 강의 - 프레임 리사이징 (Fill Hug Fixed)
프레임중에서 중요한부분인 프레임 리사이징을 배웠다.
리사이징 개념
- 프레임은 기본적으로 가로와 세로 길이가 고정이다 ( Fixed)
- 프레임을 오토레이아웃으로 감싸는 순간, Fixed 외의 다른 사이즈값이 생김
- 이걸 피그마에서는 리사이징(Re-sizing) 라고함. 사이즈가 변경된다는 뜻
- 부모의 리사이징 값에 따라 자식의 리사이징 값이 영향을 받아요.
- 반대로, 자식의 리사이징 값에 따라 부모의 리사이징 값도 영향을 받아요.
컨테이너안에 컨텐츠가 있을시 부모가 Hug라면 자식이 변할시 부모도 같이 변하게 됨
이때 부모가 Hug에서 Fixed로 변하면 자식이 변해도 부모는 그값이 변하지않음
이때 자식이 Fill로 변하면 부모의 고정값 을 그대로 따라감
여기서 자식은 언제든 부모가 되어서 Hug값을 가질수 있고 부모역시 자식이 되어서 Fill값을 가질수있다
오늘은 어떤 문제를 겪었고, 앞으로는 어떻게 해결할 것인가요
오토레이아웃과 리사이징의 개념을 실전에서는 어떻게 사용할지 아직 막막함.
그래서 직접 실전에서 사용하는 리사이징을 이용한 디자인을 보면서 연습하기