노무현 대통령 배너

Mobile Device

M35Touch Flash UI Type 1 – Default Style

by on 12.01, 2008, under M35T Flash UI

Flash UI 는 세 가지의 점증적 단계를 거쳐 디자인 될 계획이었습니다.

  1. 첫번째는 기존의 디폴트 UI (비트맵 시퀀스로 움직이는 흉내릴 냄)를 대신할 수 있는 보편적인 UI
  2. 두번째는 기존에는 볼 수 없었던 파격적인 인터페이스와 독창성이 있는 UI
  3. 세번째는 첫번째와 두번째의 중간 선의 절충 UI 이다.  즉 어디선가 본듯하면서도 독창성도 있고 세련됨을 가지고 있는 UI 라고 할 수 있겠습니다.

디자이너의 입장에서 보자면 세번째가 가장 난해한 결과물이 나올 가능성이 높은데, 다행히도 이번에는 세번째의 UI가 정식 채택되어 다음번 펌웨어 릴리즈때 적용되게 되었습니다.

먼저 M35T의 기본 UI 부터 살펴보면

위의 swf 는 M35T의 공식 웹사이트에서 가져온 건데…
디컴파일한 후 기기 부분만 가져다 컴파일 했더니 비트맵이 죄다 100% 압축으로 변경되어 용량이 살인적입니다.(2.45MB) 하지만 원래 웹 상의 커다란 swf 도 오른쪽의 사람부분을 제외하고도 무려 1.4MB라는거…
저 웹사이트 플래시 비쥬얼을 만든 디자이너는 이거 하나만으로 무개념 당첨.
기기의 외형을 볼 수 있어서 처음보시는 분들이 참고하시라고 이 엄청난 파일을 업로드 하였습니다.

새로 제작된 첫번째 UI는 다음과 같습니다.

디폴트 UI 의 사용자 접근성을 최대한 변경하지 않은 상태의 디자인이 되고자 하였습니다.  단, Utility 안에 있는 메뉴는 2depth 구조를 가지고 있는 터라(매우 불편) 이 쓸모 없어보이는 2depth 구조를 밖으로 빼내어 단일 구조를 가지게 하였습니다.

아래의 링크에서 받을 수 있습니다.

fla 다운로드

이 디자인의  UI 에 대해서는 이 글의 댓글에서 피드백을 받도록 하겠습니다.

댓글남기기 :, , , , , more...

Meritech M35Touch Flash Main UI Development

by on 11.24, 2008, under M35T Flash UI


일전에 메리테크사의 M35Touch메인 UI 공모전에 응모 하였다는 글을 올린적이 있었습니다.
응모 과정에서 담당자 분과 메일로 질의 응답을 하면서 현재(당시의 현재)는 플래시 UI를 지원하지 않고 비트맵 시퀀스지만 차후 지원을 하게될 예정이 있다는 소식을 얻을 수 있었습니다.

공모전 상품 수령 전후로 이 이야기가 진행되어 플래시 UI를 작업 진행하게 되었는데…
테스트 버전의 펌웨어 (정식 릴리즈 이전의 펌웨어라 상당히 불안정하였다) 를 새로 상품으로 받은 제품에 설치하고 플래시 UI 개발 작업을 진행하였습니다.
가혹하다면 가혹하달 수 있는 개발 과정이었는데 (본인에게 가혹하다는게 아니라 M35T 에게…)
어찌어찌 버텨내고 메인 UI 를 2가지 개발 완료하였습니다.

본인의 블로그에 개발 과정중에 겪은 경험을 바탕으로 간단한 매뉴얼을 작성하고, 제작된 UI의 bug 나 feedback 을 받을 수 있는 공간을 마련하고자 합니다.

댓글남기기 :, , , , , more...

메리테크 M35 touch 스킨 공모

by on 9.15, 2008, under M35T Flash UI


이번 메리테크의 신제품 pmp인 M35T의 스킨 공모 이벤트에 응모하는 스킨입니다.
원래 메리테크 홈페이지 이벤트 응모 게시판에 글을 올려 응모를 하는것인듯 하지만,
해당 게시판은 파일 업로드는 고사하고 본문조차 쓸 수 없게 되어 있어 부득이하게 본인의 블로그에 게시하게 되었습니다.
위에 보이는 이미지는 jpg  포맷으로 저장되어있는 관람용 파일 입니다.
실제 응모형식을 갖춘 bmp파일은 위의 다운로드 링크를 이용해 주세요.

디자인 컨셉.. 이라고 할것까진 없고 기존 디폴트 스킨에 비해서 개선한점은 다음과 같습니다.

  1. 기존 디폴트 스킨이 black톤을 가지고 있어서 그와는 전혀 다른 느낌으로 깔끔한 white, blue 톤과 라인으로 디자인 하였습니다.
  2. 현재 펌웨어 버전에서 utility 안에 놓여있는 5개의 메뉴를 모두 메인화면으로 빼내 원스톱 접근이 가능하도록하여 사용자의 접근성을 높였습니다.
  3. 간단하고 빈번한 조작 (ex:볼륨조절, main으로이동) 의 경우 스타일러스 펜을 이용하지 않고 손가락(손톱) 으로 누를 수 있게끔 크게 디자인하여 사용자 편의를 도모하였습니다.
  4. 디폴트 스킨을 사용하던 user 도 즉시 이용에 혼동이 없게끔 UI의 기본 위치는 변경하지 않았습니다.

기능 화면 부분은 화면의 종류도 굉장히 많고 기본 api가 제공되지 않은데다가 알 수 없는 부분이 많아서 (ex: 스타일러스펜으로 drag가 되는지 등) 모든 화면을 디자인 하다가는 며칠밤을 세워야 할것 같아 한 화면만 디자인 하였습니다.
입상을 하게 되면 PSD파일과 폰트 등 자료를 제공할 용의가 있으므로 여기까지만 작업해서 응모하게 되었습니다.

역시 문의를 통해 메인화면이 플래시가 아니고 이미지의 연속 시퀀스라는 정보도 얻을 수 있었는데..
차라리 M35T의 메인화면을 플래시로 제작하면 훨씬 멋진 디자인으로 작업할 수 있을텐데 하는 생각이 들었습니다. (나만의 플래시 UI를 가진 PMP… 생각만 해도 멋지다)

그럼 행운이 따르기를 기대하며…

2개의 댓글 :, , , , more...

Looking for something?

Use the form below to search the site:

Still not finding what you're looking for? Drop a comment on a post or contact us so we can take care of it!

Meta