'ᴜx' 카테고리의 글 목록 (4 Page)

본문 바로가기

ᴜx30

2020년, 어떤 UI 디자인 툴을 사용해야할까? 2020년, 오늘날의 시장은 UI 설계 도구로 가득 차 있다. Sketch가 사용자 인터페이스를 정교하고 단순하게 제작할 수 있도록 효율적인 툴을 출시한 이후, 많은 회사들이 디자인 툴 시장 점유율의 일부를 차지하기 위해 노력해왔다. UXtools에서 실시한 '2019년 디자인 툴 설문조사'를 살펴보면, 지난해 Sketch가 선두를 달렸던 것과 비교해서 꽤 많은 툴이 Sketch를 따라잡은 것을 볼 수 있다. 2019년 가장 인기 있는 UI 디자인 도구 설문조사 결과 2018년 가장 인기 있는 UI 디자인 도구 설문조사 결과 내가 관찰한 '툴의 성장, 툴을 사용한 나 자신의 경험, 그리고 이러한 툴들에 대한 다른 디자이너들의 경험'에 따르면, 1~2년 안에 Sketch, Figma, Adobe XD가 주.. 2020. 6. 12.

UI디자이너의 아티클 활용법 에이전시 입사 이래로, 나 자신과 약속한 디자인 레벨업 루틴이 있다. 이 루틴은 빈도에 따라 매일, 매주, 매달 하는 것으로 나누어진다. 그중 매일 하는 것은 아래와 같이 두 가지이다. -1. Pinterset 업로드 -2. IT 혹은 디자인 관련 아티클 하나 이상 읽는 것 많은 것을 행하려고 하기보다는, 정말 내가 꾸준히 할 수 있고 해야만 하는 것에 초점을 맞춰 계획을 세웠었다. 위의 두가지 중 내가 꾸준히 실천해오고 있는 아티클 루틴을 소개해보려 한다. "출퇴근 길에는 메일함을 열어본다." 출퇴근 길은 양질의 아티클을 선별할 시간이 부족하기 때문에, 주로 좋은 아티클을 선별해서 소개해주는 뉴스레터 형식의 국내 플랫폼을 활용한다. 디독 Design+讀(읽을 독)의 합성어로, 해외 디자인 아티클을 읽기.. 2020. 6. 10.

프로토파이(Protopie) - 02.Formula와 Variable 사용해서 Number Spinner 만들기 Formula 간단한 수식부터 변수, 함수를 활용한 가변적인 값이나 레이어의 x, y, width, height 같은 속성 값을 참조할 수 있다. 이를 활용하면 인터랙션을 보다 역동적이고 간결하게 만들 수 있다. Formula의 기본적인 사용법 Variable 숫자, 문자, 컬러 값을 할당할 수 있고, assign reponse를 사용해서 Variable의 값을 변경하고 그에 따라 변하는 인터랙션을 만들 수 있다. Variable의 기본적인 사용법 01 감소 버튼 / 증가 버튼 / 숫자가 들어갈 Text 세가지를 제작한다. 감소 버튼과 증가 버튼은 Container로 그룹핑한다. 02 Variable을 추가하고, Number를 선택한다. 03 먼저, 감소버튼에 Tab 트리거를 추가한다. Tab 하단의 +.. 2020. 6. 5.

UI / UX 디자이너를 위한 짧고 유용한 디자인 Tip Steve Schoger의 Twitter 모음 'Little UI Details'는 이해하기 쉬운 이미지로 UI 디자인의 다양한 요소를 다룬다. 확인해본 결과, 최신 업데이트는 지속적으로 이루어지지 않는다. 하지만 기본적이지만 놓칠 수 있는 디테일에 대해 쉽게 설명해주기 때문에 한 번쯤 훑어볼만하다. 01. 부정적인 링크에 대한 교묘한 액션 유도 부정적인 이차적 액션에 대한 미묘한 연결고리는 종종 큰 굵기의 버튼보다 더 잘 작동한다. (확인과 관련된 액션을 더 확실히 할 것!) 02. 최소한의 라인 사용 테두리가 너무 많으면 디자인이 정신없어 보일 수 있다. 03. 텍스트 정렬 텍스트를 정렬하는 것은 디자인을 정리하고 콘텐츠의 가독성을 높이는 쉬운 방법이다. 04. 텍스트 컬러 조정 순수한 회색 텍스트는.. 2020. 6. 4.

프로토파이(Protopie) - 01.토글(Toggle)로 Condition 이해하기 Condition Range / Chain / Condition을 이용하면, 조건부 인터랙션을 구현할 수 있다. 그중 Condition은 특정값을 기준으로, 조건부 리스폰스를 실행시킬 수 있다. 아래와 같이 'a초과, a이상, a미만, a이하, a와 같다, a와 같지 않다'의 조건 설정이 가능하다. 기준이 되는 a는 오브젝트의 속성 값과 함수, 그리고 숫자를 추가할 수 있다. 01 토글의 기본 요소인 Oval와 Rectangle를 생성하고, Container로 그룹핑한다. 02 토글버튼은 Tab 했을 때 이루어지는 인터랙션이기 때문에, Oval와 Rectangle로 구성된 Container에 Tab 트리거를 추가한다. 03 토글의 상태는 On과 Off 두 가지이기 때문에, 두 개의 Condition 설정.. 2020. 6. 3.

실제 UI 디자인 - 타이포그래피 앱에 아이콘, 사진 또는 여러 컬러 팔레트가 없을 수 있다. 하지만 디지털 솔루션은 텍스트 콘텐츠 없이는 존재할 수 없다. 텍스트는 솔루션을 이해할 수 있게끔 한다. 어떤 사람들은 디자인의 90%가 타이포그래피라고 말한다. 올바른 타이포그래피를 사용하면 솔루션의 사용자 경험이 크게 향상될 수 있다. 올바른 설정 덕분에 사용자는 콘텐츠를 더 쉽게 소비하고 더 많은 참여를 할 수 있을 것이다. 타이포그래피란? 타이포그래피는 활자를 배열하여 표시하거나 인쇄할 때 언어를 읽을 수 있도록 호소력 있게 만드는 기법과 기술이다. 글꼴 vs. 활자체 우리 모두는 동의어로 글꼴과 서체 용어를 사용한다. 하지만, 그들의 의미는 다르다. 글꼴은 하나의 특정 서체, 크기, 무게로 소개된 텍스트 문자의 시각적 표현이다. 예를 .. 2020. 4. 23.

이전 1 2 3 4 5 다음

티스토리툴바