Search Results for 'GUI'

27 POSTS

  1. 2010/04/28 ipad vector GUI elements: tabs buttons menus icons (2)
  2. 2010/02/17 Windows Phone 7 Series (4)
  3. 2010/01/25 Realism in UI Design (2)
  4. 2009/04/16 design system 의 문제 (10)
  5. 2009/01/22 Palm Pre (8)

참...사람들 빨러. 
PSD 도 모자라서 ai 파일까지. ㅋㅋ
저작자 표시 비영리 변경 금지

Windows Phone 7 Series

Posted 2010/02/17 12:34, Category under: 디자인 이것저것


Windows Phone 7 Series


타입과 그리드만으로 완성된 디자인.
클래시컬하다. 좋네.


Realism in UI Design

Posted 2010/01/25 13:04, Category under: 디자인 이것저것
"Home 아이콘은 어떻게 만들까?"
"Setting 아이콘에 들어갈 Metaphor 는 어떻게 하는 것이 좋을까?"
"직관성을 갖춘 아이콘 디자인은 뭘까?"

인터페이스 디자인을 하는 사람들...특히 GUI 디자인을 하는 사람들은 Metaphor 에 대해 수많은 고민을 하게 됩니다. 의미를 함축시켜 유저들로 하여금 직관적으로 기능을 실행할 수 있게 만드는, 사실 이 작업은 일련의 유저 시나리오라고 볼 수 있는데요. 좋은 Article 하나가 있네요.

Realism in UI Design 이라는 Article 에서는 Realistic Metaphor 를 UI 디자인에 적용시키는 것에 대해 이야기 하고 있습니다. 의미의 확장, 형태의 단순화, 실제적 의미의 단순한 접근등...다소 팬시한 Article 이지만, GUI 디자이너들이 처음 발견하게 되는 아이콘 디자인의 어려움을 잘 표현해주고 있어요.

사용자 삽입 이미지
의미영역의 확장은 쉽지만, 의미 확장에 따른 형태의 단순화를 이루기는 더 어렵습니다. 의미를 확장시키다 보면 처음에 의도했던 Metaphor 가 바뀌는 경우가 비일비재 하죠. 디자이너들이 일관성을 지켜야 하는 이유중 하나가 "처음 의도했던 대로" 만들기가 점점 어려워지고 있고, 좋은 UI, GUI 를 지닌 제품들이 시장에 많이 나오고 있기 때문이기도 하거든요.

사용자 삽입 이미지

이 단순한 ON / OFF 버튼은 Apple iPhone 의 등장으로 일순간 유행을 타버렸습니다. 손가락을 좌우로 단순히 움직이는 것 만으로 기능을 설정할 수 있게 해버렸지요. 개인적으로는 iphone 의 다양한 UX 중, 가장 으뜸이라면 이 Sliding Setting 이라고 생각하고 있습니다. 물론 이러한 ON / OFF 버튼은 Sliding interaction 이 원활하게 동작할 수 있는 환경에서만 유의미합니다.

UX, 특히 모바일 UX 환경은 2~3년전부터 오프라인의 경험을 디바이스로 옮겨가는 쪽으로 방향전환을 해버렸습니다. 손안에서 마음대로 동작시켜야 하는 모바일 디바이스들의 경우, 이러한 오프라인의 사용성을 온라인으로 똑같이 옮겨놓는 것이 이제 모바일 UX 의 핵심이 되어버렸고, 이러한 동작들이 얼마나 아름답게 이루어지느냐에 따라 그 디바이스와 서비스의 승패가 갈린다고 할 정도라고도 생각됩니다.

하지만 주의해야 할 부분은 있습니다. 손안에서 떨어져서 동작하는 모바일 디바이스들의 경우는 이러한 사례가 실제로 사용성 증대에 도움이 되지 않는다는 것이죠. 실제로 제가 지금 제작중인 단말기에 위의 Sliding ON / OFF 를 적용하기 위해 사용성 테스트를 했더니, 거의 60% 에 달하는 사용자들에게 실패율을 보였습니다. 기존의 내비게이션 단말기들이 ON / OFF 를 Radio Button 으로 처리를 하고 있었고, 이미 사용자들은 거기에 익숙해진 탓도 있었고 항상 조작하고 있는 것이 아닌, 거리상으로 50~70cm 까지 떨어져 있는 감압식 터치스크린 내비게이션 단말기를 차 안에서 빠르게 조작하기에는 위의 버튼 방식은 쓸모없다. 라는 결론을 얻었습니다.

단말기의 대부분의 디자인 작업은 끝이 난 상황이지만, 저는 아직까지도 이 Sliding ON/OFF 에 대한 미련을 못버리고 있습니다. Setting 화면 전체를 뒤집는 한이 있어도, 차안에서 가장 효율적으로, 빠르게 조작할 수 있는 Setting 화면을 만들고 싶은데, 마땅한 방법이 없어서 고민하고 있는 상황이죠. (제 밑에 있는 디자이너들이 개고생하겠지요;;)

위 Article 의 결론을 인용하면서 하소연도 마쳐야겠네요. 이 결론을 읽으니 더 답답해지긴 하지만, 어떤식으로든 결론은 나오겠지요. 후우~

"The goal is not to make your user interface as realistic as possible. The goal is to add those details which help users identify what an element is, and how to interact with it, and to add no more than those details. UI elements are abstractions which convey concepts and ideas; they should retain only those details that are relevant to their purpose. UI elements are almost never representations of real things. Adding too much realism can cause confusion."


design system 의 문제

Posted 2009/04/16 10:34, Category under: 디자인 이것저것

아침에 출근(?)하자 마자 twitter 로 지동아빠님의 글을 봤습니다. 경험이 풍부하셔서 그런지 역시 ^^b 조금 부연으로 더하는것과 함께 예전부터 궁시렁거리고 싶었던 말들을 잠깐 적어놓는 식으로 오랜만에 포스팅.

Mobile GUI 를 구현하는데 있어 가장 중요한 것은 기술입니다. 어떻게 구현하느냐에 따라 디자인으로 접근해야 하는 방향이 상당히 다르지요. Dynamic 한 GUI 를 만들어내기 위해서 국내 개발사들에서는 대부분 Flashlite 와 Flash 엔진을 이용한 Third party solution 을 사용하고 있습니다. 물론 해외에서는 Flashlite 가 대세이구요. 하지만 Flash 엔진을 사용하는 구현에는 한계가 따릅니다. 퍼포먼스 이슈죠. Linux, WM, Symbian 등의 OS 위에 embed 형태로 얹혀지는 것이 대부분이다 보니, OS 의 메모리 영역과 CPU 사용률을 제외한 부분들만 Flash 가 컨트롤하는 구조로 만들어질 수 밖에 없습니다. 그래서, 삼성이나 LG, 팬텍계열등의 국내 제조사들은 Flash 로 GUI 를 만드는 것에 상당한 거부감을 느끼고 있지만 이것이 제품을 빠른 시간내에 만들어낼 수 있는 유일한(?) 대안임에 속앓이를 하고 있지요. 그나마 다행인건, 제조사들이 안드로이드 플랫폼이나 심비안등의 플랫폼들을 계속해서 연구하고 있다는걸까요. 모사는 현재 자신들의 플랫폼을 만들어내고 있다는 소리를 들은게 벌써 2년전이니, 조만간에 뭔가 나올것 같긴 해요.

개인적으로는 iPhone 의 GUI 가 아름답다고 느꼈던 적은 없습니다. (icon 의 디테일은 좋아요. 하지만 이건 시간싸움이거든요.) 단지, 좋다 라고 느끼는거지요. 저도 touch 2세대를 쓰지만, iPhone GUI 는 예쁘다라고 느끼는 것 보다는 철저하게 논리적이다라고 느끼고 있거든요. 어떤식으로든 사용자를 컨트롤하고, 사용자가 그 컨트롤에 익숙하게 만듭니다. 변하지 않는 일관성. 그게 핵심인 것처럼 느껴집니다.

GUI 를 구성하는 많은 요소들이 있지만, LUI 와 PUI, SUI 를 함께 포용할 수 있는 GUI 가 필요합니다. 그런면에서 보자면 삼성의 터치폰 시리즈들은 글쎄요. 햅틱으로 표방되는 터치 GUI 는 너무 Fancy 합니다. (그럼에도 불구하고 저는 어제 햅틱온, 코드명 로모를 질렀습니다. -_-) 분명 그들은 iphone 과는 다른, 차별점을 가진 녀석을 만들어내고자 했었고, 불과 1주동안 UI prototype 을 만들어 냈습니다. GUI 컨셉은 또다시 2~3주동안 에이전시가 작업을 했을테구요. 여기서 나오는 비용이야 뻔합니다. 맨먼스로 따져도 총합 2억이 안넘죠. iPhone GUI 의 기획기간과 투자비용에 비하면 정말 껌값으로 만들어냈지요. 이제 투자의 문제로 들어왔습니다. ㅎㅎ

한국의 디자인 업계는 대부분 갑 - 을의 에이전트 시스템으로 흘러갑니다. 애플역시도 에이전트 시스템을 사용하고는 있지만, 비용의 차이가 엄청납니다. (이래서 돈 있는 회사로 가야되요) 국내 제조사나 애플이나 똑같이 에이전트 시스템을 사용하고 있고, 에이전시의 결과물은 자신의 회사로 귀속시키는 시스템으로 가고 있지만, 기간과 비용에서 많은 차이가 발생합니다. 그리고 생각하는 방법과 결과물을 만들어내는 방식도요. 해외쪽의 많은 디자인 회사들은 아이데이션 하고 아이콘 하나 만드는데 보통 1주일이 걸린다고 합디다. 특히 OSX 의 System preferences icon 은 정말 아름다워요. 그러면 한국의 에이전시는?

풀셋으로 디자인 시안 나오는거 3일줍니다. GUI 가이드라인까지 만드는건 길면 2달. 어쩌라고.

그나마 다행인건 NHN 이나 Daum 등의 대형 포탈에서 자신들의 디자인 시스템을 만들어내기 위한 노력들을 하고 있다는 거예요. (진짜?) 우리가 디자인 공부를 하면서 책에서 보아왔던 ideation 과정들을 실제로 거치고 Usability Test 를 하고 feedback 을 반영하는...그러한 시스템을 가져가고 있는 회사들이 많이 생기고 있어요. 근데. 한국의 에이전시는 변하지 않습니다. 아니 변하지 못합니다. 갑이 시간과 비용으로 쪼아대는데 무슨수로 그런 시스템을 가져가나요. 팀장과 실장의 독단적 디자인 컨셉에 따라가는 것이 아닌, 전체가 진지하게 고민하고, 진지하게 만들수 있고, 진지하게 그 비용을 받아내는 시스템이 만들어질 수가 없는거겠죠. 그러면 어쩌라고?

요즘은 좀 프리하게(?) 일을 하고 있는 터라, 비용과 디자인에 대해 조금씩 생각해보고 있습니다. 결론이 뻔하게 에이전시가 문제다, 제조사가 문제다. 로 가는게 아닌, 좀 깊은 시스템을 생각해보고 싶네요. 뭐, 같이 고민해보죠. ㅋㅋ


Palm Pre

Posted 2009/01/22 10:31, Category under: 디자인 이것저것
 

사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지
사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지
사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지


Palm Pre : http://www.palm.com/us/products/phones/pre/index.html

iPhone 도 가지고 싶고, G1 도 쓰고 싶고, Omnia 도 땡기지만...
이놈이 훨씬 더 마음에 든다. (내 나이와는 안맞을듯 ㅠㅠ 난 블랙베리나;;)
어떻해. 사이트도 너무 예쁘잖아.

« Previous : 1 : 2 : 3 : 4 : 5 : ... 6 : Next »



This is personal blog of Suk-hyun You, UI and GUI designer from Seoul, South Korea. It includes articles about art, design, photography and life story.

Resume and portfolio

  1. [한게임 버즐 : 잃어버린 깃털]..
  2. 다시 시작
  3. Steve Jobs (1955-2011)
  4. Birzzle (Birzzld HD) v2.0 Offi..
  5. 공백
  6. 월간 W.E.B 7월호 People Insider
  7. Top 40 Facebook Countries in A..
  8. Birzzle, 아시아에서 가장 인기..
  9. Birzzle, 모바일 앱 어워드 수상
  10. Birzzle 웹사이트 부분 리뉴얼
  11. Birzzle, 아시아 점령
  12. Birzzle Wallpaper
  13. Birzzle on iPhone by Enfeel Inc.
  14. Sukhyun.You, Facebook
  15. Aerosmith - Crazy (1994)
  1. 저도 버려두고 있잖아요 ㅋㅋㅋ..
  2. 블로그에서도 축하 드려요. ㅋ..
  3. 초대되었다고 나오네요 :)
  4. [비밀댓글]
  5. 앗 감사합니다. 여전히 지켜봐..
  6. 와우~ 착착 진행되고 있고 있었..
  7. ㅋㅋㅋ 요즘 좀 빨라지지 않았나?
  8. 텀블러 하지마하지마하지마하지..
  9. ^^ 와아 정말 반가워요 ㅋ 이거..
  10. 오래간만입니다 :-D
  11. ㅋㅋㅋㅋㅋ
  12. 앗...답글이 너무 늦었군요. ㅠ..
  13. 인도네시아와 파키스탄은 전혀..
  14. 우왕ㅋ굳ㅋ
  15. 아유 감사합니다. 그래도 주무시..
  1. 아이폰 게임엔 새가 대세? 버드+..
  2. 초고화질 영상의 자유로운 무선.. Sukhyun.blog
  3. 초고화질 영상의 자유로운 무선.. Sukhyun.blog
  4. 오픈마루 스튜디오의 사라짐 StudioEgo's Thoughts, seasonⅡ
  5. 티스토리로 블로그를 이주합니다. sukhyun.blog
  6. Panasonic GF1 sukhyun.blog
  7. 아이패드 출시, 그리고 애플의.. √ MIRiyA's AstraLog
  8. Apple iPad, 시원하게 Gorgeous.. 새우깡소년, Day of Blog
  9. 애플 iPad, 평생교육 시장을 겨.. e-learning blog : 이러닝 블로그
  10. 팅이의 생각 sejun's me2DAY
«   2012/02   »
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29      
  1. [F] yubeon
  2. [F] jfactory
  3. [F] zestor.blog
  4. [F] kimdahee
  5. [F] ziin
  6. [F] delver
  7. [F] lipio
  8. [F] keeptalk
  9. [F] seokzzang
TOTAL 713,576 HIT
TODAY 30 HIT
YESTERDAY 48 HIT