brunch

매거진 airdesk

라이킷 5 댓글

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by 한상훈 Dec 04. 2017

디데이 & 디자인

에어데스크 3.6버전

에어데스크가 업데이트 되었습니다. 이번에 추가된 점은 디데이 기능과 더 편안한 디자인입니다.

디데이

목표를 적어둘 때 며칠 남았는지 보면 편리합니다. 스마트폰에선 흔히 있는 디데이 기능을 컴퓨터로는 쉽게 확인하기 어려웠습니다. 그래선지 오로라 플래너 시절부터 디데이를 멋지게 보여주는건 오랜 목표였습니다. 몇 주간의 개발로 간단한 스타일의 디데이를 만들어봤습니다.

이번에 준비한 디데이 기능은 위와 같이 아이콘을 선택하고, 내용을 입력하는 방식입니다.

마우스 우클릭을 통해서 만들 수 있고, 수정도 가능합니다. 6개의 아이콘을 선택해서 원하는 위젯 형태로 바탕에 추가할 수 있습니다.

에어데스크 3.6 버전의 전반적인 모습

에어데스크에서 최근에 아이콘을 디자인팀에서 제작했지만 이번엔 외부 아이콘을 사용했습니다. 아이콘 제공자가 사라졌다가 새로 추가되었습니다.

디자인

컬러

저장 공간 창

색에서 여러 부분이 파스텔 톤으로 변경되었습니다. 기존의 컬러는 에어데스크 메인 컬러를 많이 사용했습니다. 제 경우엔 텍스트보다 컬러에만 눈이 가는 불편함이 있었습니다. 그래서 컬러톤은 더 편안하게 적용해보았습니다.

배경화면

에어데스크 배경화면

배경화면은 탁 트이고, 복잡하지 않은 사진으로 준비했습니다. 사진에만 집중하게 되는 일을 막기 위함입니다. 보시면 더 잘 어울린다는 걸 느끼실 수 있을 겁니다. 배경의 전반적인 톤은 웜톤이 아닌 쿨톤으로 가고 있습니다. 에어데스크가 가진 세련된 느낌과 쿨톤이 더 어울리고, 제 느낌엔 흑백의 배경이 가장 섹시하게 보입니다.

폰트 사이즈

좀 더 작아진 텍스트

컨텐츠가 부족할수록 글씨가 커지는 경향이 있나봅니다. 프로토타입부터 지금까지 폰트 사이즈는 지속적으로 작아져왔는데 더 보기 좋아지는 것 같습니다. 캘린더 내부와 정면 시간은 줄이고, 체크리스트의 폰트는 키워주었습니다. 캘린더는 텍스트가 기본적으로 많아 글씨가 크면 필요없는 정보까지 크게 보여주기 때문에 줄였습니다. 현재 시간도 중요도가 높지 않기에 기존보다 20%정도 축소하였습니다. 반면 체크리스트는 중요한 정보이므로 크게 표현했습니다.

검색바

기존의 검색바보다 약간 샤프해졌습니다. 예전부터 검색 엔진 아이콘은 작아졌고, 바는 날씬해지고 길어졌습니다. 또한 중앙 하단의 메뉴와 사이즈를 일치시켜 균형도 맞춰보았습니다.

타임픽커

바뀐 날짜 선택창

기존의 날짜 선택 상자엔 불필요한 정보가 많았습니다. 불필요한 버튼을 최소화했습니다.

메모 스냅 + 컬러

딱딱 붙일 수 있는 포스트잇 메모들

자석처럼 달라붙는 기능인 스냅을 대폭 강화했습니다. 기존의 5가지의 파스텔톤 컬러에서 조금 채도가 짙은 다양한 색을 추가했습니다.

에어데스크의 다음 계획 역시 기능과 디자인 부분에서 모두 진행됩니다.

#. 레이아웃 디자인

https://www.behance.net/gallery/57309065/Apple-OS-MacOS-2020-redesign-Edge-to-edge-Macbook

Mac OS의 기본 레이아웃은 군더더기 없습니다. 위의 이미지는 Aurélien SALOMON 의 작품입니다. 저는 에어데스크에서 이를 똑같이 모방하기 보단 분위기와 표시 방식을 많이 벤치마킹하고 싶습니다. 현재 도크 아이콘은 무채색인데 색감을 주는 방향으로 진행하고 싶습니다. 또한 앞으로 제작할 폴더나 작업하면서 생기는 창의 디자인을 위와 같이 편안하면서 예쁘게 만들고 싶습니다.

#. 알람

https://www.behance.net/gallery/59349987/Sleepy-Hollow-Alarm-App

컴퓨터로 업무를 보다가 중요한 미팅이나 마감시간을 놓치기 쉽습니다. 에어데스크에서 알람기능을 제공해 남은 시간을 실시간으로 보여줍니다. 다른 창에서 작업 중이어도 소리와 팝업으로 알람을 하고자 합니다. 아직 적절한 디자인 양식을 준비하진 못했습니다. 그러나 아직까지 새 탭 프로그램에서 알람과 연동되는 서비스는 없었던 걸로 알고 있습니다. 제가 조사해본바로는 현재 알람 프로그램의 수준도 불편한 UI로 구성된게 많습니다. 이 점에서 깜짝 놀래켜드릴만큼 좋은 서비스를 만들겠습니다.

#. 데이터 저장

저번 버그로 인해 데이터가 삭제된 분들께 약속드린 내용입니다. 에어데스크의 모든 데이터를 카피해서 브라우저의 다른 저장소에 자동(일정 주기) 또는 원하실 때 저장하는 방식을 진행중입니다. 물론 이 경우 브라우저 데이터를 삭제하면서 지워질 수 있는 문제가 있습니다. 그래서 에어데스크의 모든 데이터를 JSON 파일로 변환해 따로 다운받으실 수 있도록 하고자 합니다. 이 방법은 개념적으로는 가능한데 실제로 가능한지는 진행해봐야 하지만 저번과 같은 일이 발생하지 않도록 저장 방식을 다각화하여 지속적으로 진행하겠습니다.

#. 캘린더 사이즈 & 메모 컬러

캘린더 사이즈와 메모의 컬러 선택 기능이 빠졌습니다. 몇가지 해결하기 힘든 오류로 급하게 기능을 제한하게 되었습니다. 캘린더와 메모의 색 선택 기능이 모두 외부 코드를 가져와서 사용하는 방식이었기에 빠르게 수정이 어렵습니다. 이런 저런 플러그인과 오픈소스를 조사해본 후에 다시 기능을 추가하도록 하겠습니다.

에어데스크 다운로드:

1. 크롬 웹스토어

2. 웨일스토어

keyword