본문 바로가기

Design

(38)
텍스트에 컬러스타일 먹이기 (not 오버라이드) 스케치에서 텍스트 컬러를 변경하려면 여러 방법이 있다. 나는 아래 4가지의 방법을 테스트해보았고 각 장단점을 얘기해볼 거다. 결론을 빠르게 보고 싶다면 4번 방법으로 스크롤해서 보자! 1. 컬러 피커로 컬러 지정 2. 텍스트를 심볼로 만들어 override로 컬러스타일 적용 3. 텍스트에 마스크 씌워 override로 컬러스타일 적용 4. 텍스트를 그룹으로 묶어 컬러 스타일 적용 1. 컬러 피커로 컬러 지정 1번이 기본적으로 사용하는 방법일 것이다. 하지만 나는 매번 컬러 팔레트를 불러와서 피커로 찍어야하는게 너무 귀찮았다. 일단 킵해두고 다음 테스트로 진행. 2. 텍스트 심볼 오버라이드 이 방법은 Apple의 UI kit에서 착안되었다. Apple의 몇몇 UI들은 들여다보면 오버라이드에서 텍스트 컬러를..
[방구석모빌리티4] 미래의 모빌리티, MaaS 미래의 모빌리티, MaaS (Mobility As A Service) 이원재님(Carchap CEO) 우버의 리프트, 남미의 구구, 동남아의 그랩 같은 차량 기반의 모빌리티 서비스가 등장했다. 최근에는 이동성에 대한 정의가 확장되면서 따릉이, 전동 킥보드 등의 서비스도 생겨났다. 탈것에 대한 인프라 서비스와 애프터서비스 같은 것들도 생겨나게 되었다. 육상에서의 이동을 도와주는 것에서 항공도 도와주기 시작했고 모빌리티는 육상, 항공, 인프라까지 아우르는 단어가 되었다. 그러다 보니 결제, 예약, 운송 서비스를 다 합쳐버리면 어떨까 하는 니즈가 생기기 시작했다. 통합서비스에 대한 니즈 → 통합모빌리티서비스(MaaS) 세계 최초로 핀란드에서 출발한 용어. Whim이라는 서비스 안에는 아래 것들을 모두 사용할 ..
[방구석 모빌리티-3] 마이크로 모빌리티 서비스 마이크로 모빌리티 서비스 Gbike Product Designer - 이치훈님 왜 글로벌 기업들은 모빌리티에 관심을 가질까 - 1인용 비행 수단이 나올 정도로 다양한 형태로 이동 수단이 발전하고 있다. - 사람들의 생활 반경이 커지고 있으며, 그 이동 시간을 절약할 수 있다. - 여행, 쇼핑, 무역, 숙박, 생산 등 사실상 모든 일에 운송 수단은 필수이기 때문에 기업들이 모빌리티에 관심을 가지고 있다. 모빌리티에 대한 시각 - 제조업 기반의 교통 수단에서 서비스업 기반의 교통 수단으로 변화하고 있다. - 소비의 패러다임 역시 소유의 문화에서 공유의 문화로 바뀌고 있다. 이게 많은 변화를 주고있는데 비싼 값을 치루고 소유하기보단 필요할 때 공유물을 사용하는 방향으로 변화했다. 다양한 모빌리티 공유서비스 공..
[방구석 모빌리티-2] 인포테인먼트 시스템의 UX 인포테인먼트 시스템의 UX 현대자동차 UX Designer 김동후 님 인포테인먼트 시스템 자동차를 선택할 때 디자인이 주는 영향이 매우 크다. 자동차 디자인이라고 하면 보통 외장/내장 디자인을 떠올리는데 인포테인먼트라는 다른 디자인 영역에 대한 소개를 하고자 한다. 앞으로 도전할 게 많고 발전 가능성이 큰 분야이다. "내비가 아니라 인포테인먼트 시스템입니다" 이번 세미나에서 가장 강조하고 싶은 문장이다. Information+Entertainment의 합성어이다. 차 안에서 경험할 수 있는 정보시스템을 총칭하며 객관적인 정보와 감성적인 즐거움(음악, 영상 미디어..)이 함께하는 개념이다. Map > Audio, Video(AV) > Audio, Video, Navigation(AVN) > Audio,Vi..
[방구석 모빌리티-1] 모빌리티 서비스 트렌드 모빌리티 서비스 트렌드 카카오모빌리티 - 조아진 님 모빌리티 서비스는 사람의 이동과 사물의 이동으로 나눠볼 수 있다. 사람의 이동은 택시, 버스, 지하철, 자전거, 킥보드 등으로 사람을 태우는 운송수단이며, 사물의 이동은 사람이 탑승하지 않고 사물을 배송하는 음식 배달, 물류, 택배, 퀵서비스 등의 운송수단이다. 최근 COVID19로 큰 변화를 겪고 있는데 그 이슈들을 다뤄보려 한다. 전 세계적으로 이동 감소 COVID19로 인해 전세계적으로 이동량이 강소하였다. 전 세계뿐만 아니라 한국만 봐도 차량은 40%가 감소하였고, 도보는 57% 감소하였다. 대중교통과 장거리 이동이 특히 감소했다. 재택근무, 개학 연기/사회적 거리두기 실천으로 비정기적인 통행 자제로 인해 버스와 택시의 이용 수요가 약 32% 감..
디자인 버전 관리 툴, Abstract로 협업하며 느낀 점 앱스트랙트(Abstract)로 협업하기 앱스트랙트를 사용한 지는 수년 되었지만 다른 디자이너들과 협업할 일이 없었다. 최근에야 본격적으로 여러 디자이너들과 사용하게 되면서 겪었던 시행착오를 남겨보려 한다. 원래라면 보통 작업을 피쳐 별로 진행하겠지만 요새 디자인시스템을 잡고 있다 보니 손대야 할 것들이 많아서 더 시행착오를 겪은 것 같다. 브랜치 따고 의식의 흐름으로 작업하기? 주로 많이 했던 실수는 브랜치를 계획적으로 관리하지 않았던 것이다. 특정 개선 목적으로 브랜치를 따놓고 다른 부가적인 작업도 의식의 흐름으로 진행했다. (물론 팀에는 공유하고) '작은 수정이니까 하는 김에' 라는 마음으로 진행했지만 팀원들이 브랜치를 따면서 문제가 생기기 시작했다. 대충 브랜치 따면 이렇게 돼요 야금야금 수정을 하..
제플린 3.0의 스타일가이드 알아보기 Zeplin 3.0 & Styleguide 제플린에서 스타일가이드 기능을 내놓은 지 꽤 되었지만 사실 그동안 관심이 없었다. 내가 그러거나 말거나 제플린은 2020년 2월 달에 제플린 3.0을 선보이면서 스타일가이드를 Storybook, Github 등과 엮어 디자인시스템을 더 견고하게 만들 수 있게 되었다. 회사에서 디자인시스템에 대한 일을 하면서 실사용 목적으로 업데이트된 내용들을 테스트하니 꽤 쓸만할 것 같아 리뷰해본다. 제플린 3.0 확인하기 스타일가이드 생성 일단 스타일가이드 편집과 생성은 어드민 계정에서만 가능하다. 어드민 계정으로 접속하여 우측 상단의 1번 스타일가이드 탭을 선택한다. 2번으로 표시된 Create Styleguide라는 버튼을 누르면 3번의 스타일가이드 타입을 선택하는 팝업창..
안드로이드 적응형 앱아이콘 만들기 (Adaptive icon) Adaptive icon 예전 안드로이드에서는 iOS와는 다르게 불규칙한 아웃라인의 앱 아이콘 형태를 사용했었다. 하지만 각 핸드폰 제조사들이 각자 통일된 앱 아이콘 모양새를 쓰기 시작하면서 아이콘이 잘려 보이는 등 제작자가 의도하지 않은 모양새가 나오기 시작했다. 구글은 이것을 해결하기 위해 Android 8.0(Oreo)부터 적응형 아이콘(Adaptive icon)을 도입했다. 디바이스들마다 사용되는 모양새는 위와 같이 크게 5가지로 구분할 수 있다. 각 모양대로 시스템에서 마스크를 씌우기 때문에 제작하는 입장에서는 가이드에 맞춘 이미지만 1종으로 제작하면 된다. Guideline 개발자에게 전달할 리소스는 아래와 같다. - Background image (108dp*108dp) : 불투명 이미지 -..
디자인 버전관리 툴 7종 비교하기 (Github, Sketch Cloud, Abstract..) -2 1편(https://carrotdesign.tistory.com/53)에 이어 2편을 작성한다. 오늘 살펴볼 서비스는 Plant, Folio, Sympli이다. Plant (https://plantapp.io/) 장점 플러그인이라 편의성이 좋고 디테일한 뎁스는 웹으로 접속해서 보는 형태이다. 웹앱에서 화면을 확인할 수 있다. 업로드하는 파일의 용량 제한이 없다. (스케치 파일이 그리 무겁지 않긴 하지만.) 선택한 대지만 내보내는 기능이나 스케치 라이브러리를 지원하는 등 편의성을 제공한다. 단점 브랜치를 따서 작업하지 않고 마스터라인만 있는 것처럼 동작한다. 마스터라인과 충돌이 생기면 Preview로 보며 최신 것을 선택해야 해서 작업량이 많으면 헷갈릴 듯. 작업물이 업로드되면 다른 사람에게 메일로 알림이..
디자인 버전관리 툴 7종 비교하기 (Github, Sketch Cloud, Abstract..) -1 버전 관리? 버전 관리! 포토샵으로 작업하던 시절에는 현재 열려있는 파일의 히스토리를 관리하는 기능이 전부일 뿐, 그 이상은 없었다. 그러다 보니 버전 별로 남기고 싶으면 작업1.psd, 작업2.psd, 작업3.psd, 작업4,psd...으로 저장해두는 수밖에 없었다. (얼마나 고된 세월이었던가) 작업물을 버전 별로 따로 저장해두고, 수정 사항이 생기면 또 저장하고, 저장, 저장, 또 저장. 그러던 중 디자이너들이 개발 친화적으로 변하면서 Github이라는 개발 버전 관리 툴에 관심을 갖게 되었다. 나 같은 경우에는 작업 파일을 여러 버전으로 들고 있기 싫었고, 작업 과정을 기록하고 싶어서 Github에 관심을 가졌다. 버전 관리를 하면 좋은 점이 무엇일까. 버전 관리를 하면 변경된 사항을 쉽게 저장하고..