All about design 6

[UI/UX] UI 디자인, 프로토타입, 그리고 피드백까지 - 피그마(Figma)에 대해 알아보자

안녕하세요? 오늘은 해외 디자인 업계에서 많이 쓰고, 저도 실무에서 쓰고 있는 유저인터페이스, 프로토타입 툴인 피그마(Figma)에 대해서 알아보도록 하겠습니다. 피그마(Figma)란? www.figma.com/ 피그마(Figma)는 클라우드 베이스 디자인 프로토타입 툴로, 스케치(Sketch)와 어도비 XD와 같이 프로토타입을 설계하는 툴입니다. 화면이나 기능적인 면 등에서 스케치와 유사하다고 볼 수 있는데요. 하지만 가장 큰 차이점 두 가지가 저에게 매력적으로 다가왔습니다. 1. 어느 환경에서도 사용할 수 있는 피그마 스케치 프로토타입은 애플 제품에서만 이용 가능한 반면, 피그마는 맥(Macs), 윈도우PC (Window PC)에서도 사용 가능하고, 웹(Web)페이지에서 또는 프로그램을 설치 해서도 ..

UI & UX 2020.11.08

UI와 UX 공부할 때 봐야 할 해외 디자인 가이드(Design guide) 웹사이트 3곳

안녕하세요? UI/UX 디자인 시에 참고 할 만한 웹사이트 몇 곳 소개 해 드립니다. 저도 자주 방문하기 때문에 이렇게 글로 남겨봅니다. 1 - 매터리얼 디자인(Material Design) 구글에서 제작한 UI/UX 가이드라인 웹사이트입니다. 웹사이트, 앱 등을 디자인할 때 어떻게 가이드라인을 잡아야 하는지 보여줍니다. material.io/designmaterial.io/ 2 - 마이크로소프드 디자인 (Microsoft Design) 마이크로소프트에서 제작한 UI/UX 가이드라인 웹사이트입니다. 특이 할만한 사항이라면, 포괄적인 디자인을 다룹니다. Inclusive, 색맹, 소리 및 눈 장애가 있거나 하여 일반적으로 디바이스를 사용할 수 없을 때 생각해 볼만한 것들을 강조합니다. www.microso..

Useful resource 2020.11.03

[브랜딩] 자신만의 유니크한 디자인 스타일 찾기

안녕하세요? 국내, 해외 디자이너들을 보면 자신만의 개성있는 그래픽 디자인 스타일을 보면서 '아, 나도 저런 스타일을 가지고 싶어!' 라는 생각 많이 해보셨을 것입니다. 그럴 때마다 자신이 가지고 있는 특별한 개성이 무엇인지도 모르겠고, 뭘 잘하는지도 모르겠고, 만들다 보면 다른 디자인이랑 비슷하기도 하고, 그런 생각 혹시 안 드셨나요? 저 같은 생각을 하시는 분들을 위해 에 대해 이야기 해 볼까 합니다. Step 1 - 유니크 한 자신을 발견하기 '자기 자신부터 알라' 라는 말이 있죠? 유니크 한 디자인 스타일을 찾기 전에, 자기 자신이 왜 다른 사람들과 다른지, 유니크 한 점을 먼저 찾아보도록 합니다. 남들은 별로라고 생각하지만, 자신이 특히 좋아하는 것이 있나요? 자신이 어릴 때부터 좋아 해 왔던 ..

Branding 2020.10.27

UX, UI, 프로덕트 디자이너 - 이들이 하는 일은 무엇일까?

안녕하세요? 오늘은 많은 분들이 헷갈려 하시고, 심지어 저도 가끔씩 헷갈려 하는 이 세가지 - UX, UI, 그리고 제품(Product) 디자이너들이 실제로 일을 하는 차이점들은 무엇인지 알아보도록 하겠습니다. UX 디자이너란? UX는 User Experience의 준말로, 사용자의 경험을 디자인하는 일을 맡고 있습니다. 우리가 사용자로써 이용하는 수 많은 웹사이트(Website)들과 핸드폰 모바일 앱(App)을 사용자 관점에서 생각하고, 사용하면서 겪는 문제점을 해결하기 위해 1) 리서치, 2) 디자인, 3) 테스팅을 하며 좀 더 사용하기 쉽도록 만드는 일을 합니다. 회사마다 그리고 회사가 제공하는 제품(웹사이트나 앱)에 따라 이 세 카테고리 중 하나를 더 많이 하기도 더 적게 합니다. UI 디자이너란..

UI & UX 2020.10.21

[UI/UX] 드롭다운(Dropdown)에 대해 알아보자

드롭다운(Dropdown)이란? 드롭다운은 사용자가 여러 값(Value)이 있는 리스트에서 하나의 값(Value)을 선택할 수 있도록 하는 요소(Element)입니다. 드롭다운은 광범위하게 사용되는데요. 크게 드롭다운 메뉴(Dropdown Menu)와 드롭다운 리스트(Dropdown List) 두개의 타입으로 구분 짓습니다. 드롭다운 메뉴는 주로 웹사이트나 앱에서 어디로 가야할 지 네비게이션 역할을 합니다. 그래서 웹사이트의 상단에 주로 배치 됩니다. 사용자가 처음 접했을 때 자연스럽게 왼쪽 상단부터 시선이 가기 때문에 쉽게 찾을 수 있는 위치입니다. 디자인은 다르지만 서브메뉴가 있는 대부분의 웹사이트들은 이 드롭다운 메뉴를 사용합니다. 반면 드롭다운 리스트는 드롭다운 메뉴와 다르게 값을 선택해야 하는 ..

UI & UX 2020.10.09

[UI/UX] 툴 팁(Tooltip)에 대해 알아보자

안녕하세요? 오늘은 툴팁에 대해 자세하게 알아보겠습니다. 툴팁이란? 툴팁(Tooltip), 인포팁(Infotip) 또는 힌트(Hint)라고 불리는 툴 팁은 마우스를 아이템에 갖다대었을 때(Hover) 나타나는 정보가 적혀 있는 박스입니다. 툴 팁은 정말 흔해서 아무곳에서나 찾을 수 있습니다. 마우스 커서가 아이템에 갖다대었을 때 나타나기 때문에 모바일 버전에서는 이 툴팁 기능을 활성화 시키기 위해서 아이콘으로 모바일 버전에서도 클릭할 수 있도록 고려하거나, 다른 행동, 예를 들어 길게 누르기(Long press)로 대처 합니다. 툴팁의 장점은? 툴팁의 좋은 점은, 사용자들이 웹사이트나 앱(App)을 사용하면서 겪는 문제점 및 자주 묻는 질문들에 빠르게 대처할 수 있습니다. 그렇기 때문에 추가 인력을 요하..

UI & UX 2020.10.07