SlideShare a Scribd company logo
1 of 40
Download to read offline
Portfolio
Wooseok Jeon
dimix@naver.com

                      @dimix_                           dimix-discovery.info
                                                      302-1201, Sowon-ro 267, Deogyang-gu, Goyang-si, Gyunggi-do, Korea.
                                                                       @dimix_

 A Meticulous Service Planner
           dimix-discovery.info
                                                                                                                           *, Discovery Everything
       *
경기도 고양시 덕양구 소원로 267, 302-1201
 302-1201, Sowon-ro 267, Deogyang-gu, Goyang-si, Gyunggi-do, Korea.
                                                                                                                           저는,
                                                                                                                           세상에 있는 모든 것을 탐구하고 그 속에서 새로운 것을 발견하는 디자이너입니다.
  @dimix_ Student Group, Eumstudio EumIdean DiMIX’ Discovery
                                                 s
  Republic of Korea                                                                                                        세상의 모든 관계에 대해 호기심을 가지고,
’ Discovery
s                                                                                                                          그 속에서 사람과 사람을 이어줄 수 있는 방법을 발견하는 설계자입니다.
’ Eumstuio
s
  Idean


                                                                              체계적인
                                                                                   Idean

                                                                                                 성실한
                      EumIdean
                                     @dimix_
                      #Eum #UX 사무엘
                      dimix@naver.com
                      @dimix_




                                                                                                                                                                            eXperience                                     Timi
                                                                                                                                                                    User Interface                                    Open Minde

                                                                                                                             Interactive Contents                   Media Mobile                                  Careful
                                                                                                                              Service Designer
                                                                                                                                                                                                              Thinkful Shy
                                                                                                                                                                             Public
                                                                                                                                                                    UsabilityTesting
                                                                                                                                                                    Digital Contents                        Process Oriented
                                                                                                                                                                    Psycal Interaction
                                                                                                                                                                    Programming
                                                                                                                                                                                                      Meticulous
                                                                                                                                                                                                       Precise Analysis
                                                                                                                                                                                              Trustworthy

                                                                                                                                                                                           Brilliant Idea
                                                                                                                                                                                         Interaction Designer
                                                                                                                                                    디자이너의 감성을 갖춘 꼼꼼한 이성을 함께 가진 서비스 디자이너 Punctual

                                                                                                                                                        다양한 서비스, 그 사이에서 가장 빛나고 세심한 한 줄기 가는 빛.
Profile                                                           Contact
Researcher / UX Center, CMD Division, NHN Corp.                   +821036803951
Senior / Dept. of Digital Media Design, School of Design & Art,   dimix@naver.com
        Hongik Univ.                                              www.dimix-discovery.info
                                                                  @dimix_
2011 NHN 인턴쉽 수행 - 게임 UX팀, 게임 UXD센터
    (게임 사이트 커뮤니티 UX설계, 디펜스게임 PX리뷰)
    NHN UXDP 6th UX부문 참여 - ‘모바일 한게임 웹사이트 및 프로모션 제안’
    한이음 IT 멘토링 ‘스마트폰 분실 대책 시스템 2차 프로젝트’ 수행


2010 전공 내 학생회 활동
    Eum(전공 내 UX/UI 스터디그룹) 학생대표
    ‘색채 원리를 적용한 모바일 게임 개발 프로젝트’ 참여 - 보조연구원
    (한국콘텐츠진흥원 주관, 홍익대학교-브랜드업 산학 프로젝트)
    ‘색채 원리를 적용한 모바일 게임의 사용성 연구’ 논문 작성 - 주저자
    (`2010 전국 대학생 디자인 학술대회 포스터 발표)
    한이음 IT 멘토링 ‘스마트폰 분실 대책 시스템 1차 프로젝트’ 수행


2009 육군 제3005부대 만기전역
2006 홍익대학교 디자인영상학부 입학
2004 숭실고등학교 졸업
1985 경기 부천 출생
Contents
UX Design & Research
색채 원리를 적용한 모바일 게임의 사용성 평가 / 사용성 평가. 2011
OS vi - Smart Pad UI Design / 모바일 UX설계. 2011
PhoneFinder / 웹+모바일 UX설계. 2010-2011
모바일 한게임 홈페이지 화면설계 / 모바일 UX설계. 2011
테라 공식 홈페이지 커뮤니티 개선안 설계 / 웹 UX설계. 2011




UI Design
홍익대학교 사이버강의 어플리케이션 / 모바일 UI 디자인. 2010
당신의 여권, 안녕하십니까? / 웹 UI 디자인. 2010




Other Design Works
상상마당의 인포메이션 네비게이션 디자인 / 편집디자인. 2009
인간무기체계발달사 / 인포그래픽, 모션그래픽. 2010
無印良品, 原硏哉 (무인양품, 하라 켄야) / 편집디자인. 2010
A Study on Usability of
Mobile Games Using Color Theory
2011
디자인 연구논문, 사용성 평가
주저자 / 학생 3명, 지도교수 1명, 35%


*IJCD 2011 포스터발표
색채 원리를 적용한           Research Paper
                     Usability Test
                                      Team Work
                                      -Primary Writer, 35%
                                                                 A0
                                                                 Print (Poster), Paper
모바일 게임의 사용성 연구       2010




색채 원리에 대한 게임 규칙으로서의 사용 가능성과
이와 관련한 게임 사용성의 문제를 도출하는 프로젝트




                                                             색상 및 명도 구분 게임
                                                             3단계 명도로 나눠진 블록을
                                                             동일 색상의 명도 순으로 맞춰
                                                             블록을 없애는 게임




                                                                      색상 혼합 게임
                                                                      상어를 피하면서 물고기의 색을
                                                                      제시된 해초의 색과 같아지게
                                                                      먹이를 먹어 혼색하는 게임




                                                                      색상 및 명도 구별 게임
                                                                      다양한 색과 모양의 패턴을
                                                                      제시된 모양과 색상 및 순서로
                                                                      맞추는 게임
평가 개요
                                    공통 평가 항목                 세부 평가 항목
평가 일시 : 2010년 8월 25일~26일
평가 대상 : 8명 (미술 전공자 4명, 비전공자 4명)
평가 방법 : PC의 시뮬레이션을 통한 관찰 및 인터뷰    색채 원리의 이해도   색상 및 명도 구분, 혼색

                                  학습 효과        평가 후 색채 원리 습득 여부

                                  게임의 적응성      게임 난이도의 적합성 / User Type 별 게임 적응도

                                  조작의 용이성      조작 방법과 사용자의 기대 간 일치 여부 / 피드백의 즉각성 및 적합성

                                  GUI          그래픽 요소의 배치 및 기능의 명확성 / 메인 메뉴 구성 요소의 적절성

                                  게임의 재미       게임의 동기 부여 / 게임의 참신성 및 흥미도
게임 UI 및 색채 이론 활용 가이드

                                                        Hard

                                              (Hard)
                                              (Easy)

                                                                            Easy
색채 원리 : 명도               색채 원리 : 혼색                    색채 원리 : 색상
중명도 이하로 색상을 구성해야         1차색(순색) 중심의 혼색을 주로 사용하고,      색상환 상에서의 거리를 조절하여
사용자들이 쉽게 구분할 수 있다.       2차색(혼합색) 간 혼색은 고난이도에서 적용한다.   게임의 난이도 요소로 사용할 수 있다.
                                                       비교색이 색상환에서의 거리가 가까울수록
                                                       난이도가 높아진다.




도움말                      피드백                           동기부여
게임 진행 방식에 대한 도움말과 더불어,   미션을 달성하거나 실패할 경우,             점수, 반복성과 같은 게임적인 요소를 통해
각 게임에 해당하는 색채 원리에 대한     제한시간이 소진되어 가는 경우 및            사용자의 흥미와 지속성을 유발하는 것이
기본적 설명을 제공해야 한다.         게임 조작이 틀렸을 경우에 대한             선행되어야 한다.
                         명확한 피드백이 있어야 한다.
OS vi
Smart Pad OS UI Design
2011
모바일 UX설계
학생 2명, 40%


*졸업작품
OS vi                   Mobile OS UX Design
                        2011
                                              Team Work
                                              -40%
                                                          1024*768
                                                          Smart Pad
Smartpad OS UI Design



기존과 다른 스마트패드용 바탕화면부 UI를 제시하여
새로운 사용자경험을 제안하는 프로젝트
사용하려는 상황에 맞는 어플리케이션 추천 및 분류                 “Situation”   / Concept
마켓, 웹검색 연동을 통한 확장성 증대
내부 컨텐츠로의 접근성 확보

                                                             Widget



                                               Lock
                                              Screen                       Smart
         Market
                                   Search                   Smart          Sorting
                                    Page                     Page
                    External                                                        Suggest
                    Contents                                                         Apps

                                                               Task
          Web                   Internal                      Manager    Informa-
                               Contents                                     tion


                   / 접근성 + 확장성                                   / 편의성
Information Architecture




Wireframe
                                                           Network                                 Battery                      Network                Battery               Network                Battery                       ama




12:00
                  Project Review    Widget #2 Title
                  14:30 - 16:30     Content
                                                                                                                                                                                                                    Market
                  Widget #1 Title   Widget #2 Title
                                                      Folder                Folder                  Folder               Folder           Folder        Folder       Disconneted                    Wi-Fi Connect
 Wed, Sep 14      Content           Content
                  Widget #1 Title                                                                                        App. Name        App. NameA      pp. Name   App. Name         App. NameA    pp. Name                                Add Market
                  Content                                      App. Name             App. Name
                                                                                          NameA              App. Name
                                                                                                              pp.




                                                                                                                                                                            Genius                                  Result
                                                                                                                         App. NameA        pp. NameA      pp. Name                     App. Name    App. Name
                                                               App. Name
                                                                    NameA            App. Name
                                                                                      pp. NameA              App. Name
                                                                                                              pp.
                                                                     App. Name   Information                                                                                                                                 App Name
                                                                                                                                                                                                                                        App Name
                                                                                 Category: Books
                                                                                 Updated: Apr 13, 2011
                                                                                 Version: 1.1.1                                                                                                                                         App Name
                                                                                 Size: 701.11 MB                         App. NameA        pp. NameA      pp. Name                     App. NameA    pp. Name
   Search Page   Slide to              Smart Page
                                                                                 Language:Name                                                                                                                               App Name
                                                               App. Name
                                                                    NameA                pp. English
                                                                                       App. NameA            App. Name
                                                                                                              pp.
                                                                       Genius    Seller: Amazon                                                                                                                                         App Name

                                                                                 Provider                                                                                                                                               App Name
                                                                                                                                                                                                                             App Name
                                                                                                                         App. NameA        pp. NameA      pp. Name                     App. NameA    pp. Name
                                                               App. Name
                                                                    NameA            App. Name
                                                                                      pp. NameA              App. Name
                                                                                                              pp.                                                                                                                       App Name


                                                                                                                                                                                                                                        App Name
                                                                                                                                                                                                                             App Name
                                                                                                                         App. NameA        pp. NameA      pp. Name                     App. NameA    pp. Name
                                                               App. Name
                                                                    NameA            App. Name
                                                                                      pp. NameA              App. Name
                                                                                                              pp.


                                                                                                                                                                                                                             App Name
PhoneFinder
스마트폰 분실 대책 시스템
2010-2011
서비스 기획 / 웹 및 모바일앱 UX 설계 / 웹 및 모바일앱 UI 디자인
멘티 / 학생 4명, 지도교수 1명, 35%


*한이음 IT 멘토링
PhoneFinder                                   Service Planning
                                              Web + Mobile App UX Design
                                                                           Team Work
                                                                           -50%
                                                                                       1024*768 / 480 * 800
                                                                                       Web / Smartphone
스마트폰 분실 대책 시스템                                Web + Mobile App UI Design
                                              2010-2011




웹과 연동 가능한, 스마트폰을 분실했을 때 쉬운 회수와
개인정보 보호를 돕는 서비스 기획 및 디자인.
컴퓨터공학과 학생 2명 + 디자인과 학생 2명으로 2개 팀 구성
1차 프로젝트 : 2010.11 - 2010.12 / 서비스 기획 및 화면설계
2차 프로젝트 : 2011.1 - 2011.5 / 화면 디자인 및 개발




서비스 컨셉 : 나 화나면 무섭다
스마트폰을 분실하였을 때,
대책을 단계적으로 설정할 수 있도록 한다.
이를 통해 분실 상황에 맞추어
단계별로 행동 방안을 달리하여
대응할 수 있도록 한다.
Information Architecture   Service Taskflow
웹사이트 및 모바일 어플리케이션 정보설계     사용자의 서비스 이용 흐름 및 주요 과업 설정




Wireframe
웹사이트 및 모바일 어플리케이션 상세설계
Design : Web
Design : Mobile App
모바일 한게임 홈페이지 및
프로모션 제안
2011
모바일앱 UX설계
학생 7명, 20%


*NHN UXDP 2011 수행 프로젝트
Mobile Web UX Design   Team Work   640 * ???
모바일 한게임 홈페이지 화면설계                  2011                   -20%        Smartphone




한게임 모바일웹의 UX 설계

서비스 기획
기존 한게임이 갖고 있던 게임 채널링 역할을 확장하여
모바일웹에서의 게임 관리 기능을 통해 컨텐츠의 지속적 소비
및 매치메이킹 유도
Information Architecture
Wireframe
테라 공식 홈페이지
커뮤니티 개선안 설계
2011
커뮤니티 UX설계
개인작업


*NHN 게임UX팀 인턴쉽 수행 프로젝트
테라 공식 홈페이지                     Community UX Design
                               2011
                                                     Individual Work   1024 * ???
                                                                       Web
커뮤니티 개선안 설계



테라 공식 홈페이지(tera.hangame.com)의 WCMS 개선안 설계

리서치                            문제점 분석
테라 공식 홈페이지 커뮤니티의 문제점 파악을 위해    기존 테라 공식 홈페이지 커뮤니티의 문제점을
게임 내 사용자를 대상으로 인터뷰 및           공간, 주목도, 사용성 측면에서 분석
게임 웹진 등 벤치마킹


UX 전략
공간, 주목도, 사용성 개선을 위한 UX전략 제시

1단계 : 이용 목적에 맞는 명확한 방향 제시
2단계 : 커뮤니티 내 정보의 확대 및 재생산 지원
3단계 : 유기적인 커뮤니티 사용 흐름 조성
주요 개선안 설계

토론게시판 : 게시판 카테고리 추가, 쉬운 토론 참여 방식 제시   스크린샷게시판 : 베스트 게시글 영역 추가
테라지식iN : 베스트 답변 개선, 질문하기 입력필드 추가   게시글 댓글 내부 : 베스트 댓글 및 댓글 정렬 기준 개선   테라 통합검색 : 정보설계 및 검색결과 출력 방식 개선
홍익대학교 사이버강의 어플리케이션
2010
모바일앱 UI디자인
개인작업


*수업과제
홍익대학교 사이버강의 어플리케이션             Mobile App UI Design
                               2010
                                                      Individual Work   1024 * 768
                                                                        Smart Pad




홍익대학교 사이버강의 스마트패드용 어플리케이션 디자인

리서치                            서비스 컨셉 : 스스로 배우기
사이버강의 수강생을 대상으로                사이버강의의 참여율을 높이고,
사이버강의 이용 만족도, 수강 집중도에 대한 인터뷰   자신이 수강한 과목과 연계된 교육 컨텐츠로의
                               접근성 향상


디자인 포인트
컬러코드를 통한 네비게이션
단계적 접근을 유도할 수 있는 인터페이스
01_ 마이홈(개강 이전)   02_ 수강계획서 작성화면   03_ 수강계획서 확인화면




04_ 마이홈(개강 이후)   05_ 강의 보기 화면     06_ 수업보고서 작성 및 제출화면
당신의 여권, 안녕하십니까?
2009
웹 UI 디자인
개인작업


*수업과제
당신의 여권, 안녕하십니까?              Web UI Design
                             2009
                                             Individual Work          1024 * 768
                                                                      Web




여권 분실 현황을 알리고, 경각심을 불러 일으킬 수 있는 사이트 디자인

서비스 컨셉 : 퍼즐게임
국가 별, 날짜 별 여권 분실 신고 접수 현황을
보석 퍼즐 게임처럼 나타내어
색상에 따라 심각성을 알릴 수 있는 디자인




                                                               상단 인디케이터 드래그를 통한 다른 날짜 조회하기




                                                               각 구슬에 마우스 오버 시 나타나는 세부 현황
상상마당의
인포메이션 네비게이션 디자인
2009
네비게이션 디자인, 편집 디자인
개인작업


*수업과제
홍익대학교 사이버강의 어플리케이션         Mobile App UI Design
                           2010
                                                  Individual Work   1024 * 768
                                                                    Smart Pad




상상마당의 네비게이션 디자인 제안

리서치                        사용자 집단 구분
필드스터디 및                    컨텐츠 네비게이션 위주의 고정 방문자와
방문객 대상으로 인터뷰 수행            출구 네비게이션 위주의 첫 방문자로 분류




디자인 컨셉 : 당신을 설레게 하는 상상
호기심을 증폭시킬 수 있는 컨텐츠 네비게이션
쉽고 빠른 출구 네비게이션
브로슈어 : 고정된 정보 안내           쪽지 : 컨텐츠 네비게이션
고정된 정보에 호기심을 가질 수 있도록 유도   점층적으로 정보를 제공하여 호기심 자극




컬러코드 : 출구 네비게이션
유사 속성의 컨텐츠 이용 공간을
컬러코드를 통해 빠른 접근 유도
인간무기체계발달사
2010
인포그래픽, 모션그래픽
개인작업


*수업과제
인간무기체계발달사                   Infographic
                            Motiongraphic
                                            Individual Work   A3 / 720*480
                                                              Print / Video
                            2010




인간의 무기 발전 역사를 조명하는 프로젝트

디자인 컨셉 : 바퀴벌레               Infographic
끈질긴 생명력과 카니발리즘을 가진 바퀴벌레를
소재로 인간의 잔혹함을 순화하여 표현




디자인 포인트
무기라는 딱딱한 소재를 쉽게 표현
카툰 식의 애니메이션으로 심각한 주제의 희화화
Motiongraphic
무인양품, 하라 켄야
2010
편집디자인
개인작업


*수업과제
인간무기체계발달사              Editorial Design
                       2010
                                          Individual Work   410mm*410mm
                                                            Print




하라 켄야의 디자인 철학에 대한 내용을 담은 편집디자인

디자인 컨셉 : 백
하라 켄야의 디자인 철학을
레이아웃에 적용하여 여백의 미를 강조




Design
Wooseok Jeon - Portfolio
Wooseok Jeon - Portfolio

More Related Content

Viewers also liked

이민의 포트폴리오
이민의 포트폴리오이민의 포트폴리오
이민의 포트폴리오Min Lee
 
디발자가 말하는 시선을 끄는 PPT
디발자가 말하는 시선을 끄는 PPT디발자가 말하는 시선을 끄는 PPT
디발자가 말하는 시선을 끄는 PPTJungwon An
 
SHOPIN_Portfolio
SHOPIN_PortfolioSHOPIN_Portfolio
SHOPIN_Portfolio정목 임
 
[피키캐스트] 5학년선배 ppt 템플릿 레이아웃
[피키캐스트] 5학년선배 ppt 템플릿 레이아웃[피키캐스트] 5학년선배 ppt 템플릿 레이아웃
[피키캐스트] 5학년선배 ppt 템플릿 레이아웃o_senior
 
강지연 Portfolio
강지연 Portfolio강지연 Portfolio
강지연 PortfolioJiyeon Kang
 
백승영_ 기획 포트폴리오
백승영_ 기획 포트폴리오백승영_ 기획 포트폴리오
백승영_ 기획 포트폴리오Seungyoung Baek
 
포트폴리오 0421
포트폴리오 0421포트폴리오 0421
포트폴리오 0421henni31
 
Songhee Choi Portfolio
Songhee Choi PortfolioSonghee Choi Portfolio
Songhee Choi Portfolio4pril12th
 
Portfolio Lee Sun Joo 2012~2015
Portfolio Lee Sun Joo 2012~2015Portfolio Lee Sun Joo 2012~2015
Portfolio Lee Sun Joo 2012~2015sun joo lee
 
Portfolio 초안
Portfolio 초안Portfolio 초안
Portfolio 초안rururuadf
 
Ncanvas Corp. Web agency Portfolio
Ncanvas Corp. Web agency PortfolioNcanvas Corp. Web agency Portfolio
Ncanvas Corp. Web agency Portfolioilhyun Jeon
 
Designnavi Portfolio
Designnavi PortfolioDesignnavi Portfolio
Designnavi PortfolioJung Hee Kim
 
김승지 포트폴리오
김승지 포트폴리오김승지 포트폴리오
김승지 포트폴리오승지 김
 
Jinhee Lee's Portfolio.- Character designer
Jinhee Lee's Portfolio.- Character designerJinhee Lee's Portfolio.- Character designer
Jinhee Lee's Portfolio.- Character designerLEE-JIN-HEE
 
2010 kimchulhwee portfolio_new
2010 kimchulhwee portfolio_new2010 kimchulhwee portfolio_new
2010 kimchulhwee portfolio_newChulhwee Kim
 
김은혜 개인포트폴리오New
김은혜 개인포트폴리오New김은혜 개인포트폴리오New
김은혜 개인포트폴리오Neweunhye kim
 
윙토리 포트폴리오 13년도 상반기 1.5ver
윙토리 포트폴리오 13년도 상반기 1.5ver윙토리 포트폴리오 13년도 상반기 1.5ver
윙토리 포트폴리오 13년도 상반기 1.5verlibbonkorea
 
개발자 이승우 이력서 (2016)
개발자 이승우 이력서 (2016)개발자 이승우 이력서 (2016)
개발자 이승우 이력서 (2016)SeungWoo Lee
 

Viewers also liked (20)

이민의 포트폴리오
이민의 포트폴리오이민의 포트폴리오
이민의 포트폴리오
 
디발자가 말하는 시선을 끄는 PPT
디발자가 말하는 시선을 끄는 PPT디발자가 말하는 시선을 끄는 PPT
디발자가 말하는 시선을 끄는 PPT
 
SHOPIN_Portfolio
SHOPIN_PortfolioSHOPIN_Portfolio
SHOPIN_Portfolio
 
[피키캐스트] 5학년선배 ppt 템플릿 레이아웃
[피키캐스트] 5학년선배 ppt 템플릿 레이아웃[피키캐스트] 5학년선배 ppt 템플릿 레이아웃
[피키캐스트] 5학년선배 ppt 템플릿 레이아웃
 
강지연 Portfolio
강지연 Portfolio강지연 Portfolio
강지연 Portfolio
 
백승영_ 기획 포트폴리오
백승영_ 기획 포트폴리오백승영_ 기획 포트폴리오
백승영_ 기획 포트폴리오
 
포트폴리오 0421
포트폴리오 0421포트폴리오 0421
포트폴리오 0421
 
Songhee Choi Portfolio
Songhee Choi PortfolioSonghee Choi Portfolio
Songhee Choi Portfolio
 
Portfolio Lee Sun Joo 2012~2015
Portfolio Lee Sun Joo 2012~2015Portfolio Lee Sun Joo 2012~2015
Portfolio Lee Sun Joo 2012~2015
 
Portfolio 초안
Portfolio 초안Portfolio 초안
Portfolio 초안
 
Ncanvas Corp. Web agency Portfolio
Ncanvas Corp. Web agency PortfolioNcanvas Corp. Web agency Portfolio
Ncanvas Corp. Web agency Portfolio
 
Designnavi Portfolio
Designnavi PortfolioDesignnavi Portfolio
Designnavi Portfolio
 
김승지 포트폴리오
김승지 포트폴리오김승지 포트폴리오
김승지 포트폴리오
 
Jinhee Lee's Portfolio.- Character designer
Jinhee Lee's Portfolio.- Character designerJinhee Lee's Portfolio.- Character designer
Jinhee Lee's Portfolio.- Character designer
 
2010 kimchulhwee portfolio_new
2010 kimchulhwee portfolio_new2010 kimchulhwee portfolio_new
2010 kimchulhwee portfolio_new
 
Portfolio
PortfolioPortfolio
Portfolio
 
김은혜 개인포트폴리오New
김은혜 개인포트폴리오New김은혜 개인포트폴리오New
김은혜 개인포트폴리오New
 
Portfolio
PortfolioPortfolio
Portfolio
 
윙토리 포트폴리오 13년도 상반기 1.5ver
윙토리 포트폴리오 13년도 상반기 1.5ver윙토리 포트폴리오 13년도 상반기 1.5ver
윙토리 포트폴리오 13년도 상반기 1.5ver
 
개발자 이승우 이력서 (2016)
개발자 이승우 이력서 (2016)개발자 이승우 이력서 (2016)
개발자 이승우 이력서 (2016)
 

Wooseok Jeon - Portfolio

  • 2. dimix@naver.com @dimix_ dimix-discovery.info 302-1201, Sowon-ro 267, Deogyang-gu, Goyang-si, Gyunggi-do, Korea. @dimix_ A Meticulous Service Planner dimix-discovery.info *, Discovery Everything * 경기도 고양시 덕양구 소원로 267, 302-1201 302-1201, Sowon-ro 267, Deogyang-gu, Goyang-si, Gyunggi-do, Korea. 저는, 세상에 있는 모든 것을 탐구하고 그 속에서 새로운 것을 발견하는 디자이너입니다. @dimix_ Student Group, Eumstudio EumIdean DiMIX’ Discovery s Republic of Korea 세상의 모든 관계에 대해 호기심을 가지고, ’ Discovery s 그 속에서 사람과 사람을 이어줄 수 있는 방법을 발견하는 설계자입니다. ’ Eumstuio s Idean 체계적인 Idean 성실한 EumIdean @dimix_ #Eum #UX 사무엘 dimix@naver.com @dimix_ eXperience Timi User Interface Open Minde Interactive Contents Media Mobile Careful Service Designer Thinkful Shy Public UsabilityTesting Digital Contents Process Oriented Psycal Interaction Programming Meticulous Precise Analysis Trustworthy Brilliant Idea Interaction Designer 디자이너의 감성을 갖춘 꼼꼼한 이성을 함께 가진 서비스 디자이너 Punctual 다양한 서비스, 그 사이에서 가장 빛나고 세심한 한 줄기 가는 빛.
  • 3. Profile Contact Researcher / UX Center, CMD Division, NHN Corp. +821036803951 Senior / Dept. of Digital Media Design, School of Design & Art, dimix@naver.com Hongik Univ. www.dimix-discovery.info @dimix_ 2011 NHN 인턴쉽 수행 - 게임 UX팀, 게임 UXD센터 (게임 사이트 커뮤니티 UX설계, 디펜스게임 PX리뷰) NHN UXDP 6th UX부문 참여 - ‘모바일 한게임 웹사이트 및 프로모션 제안’ 한이음 IT 멘토링 ‘스마트폰 분실 대책 시스템 2차 프로젝트’ 수행 2010 전공 내 학생회 활동 Eum(전공 내 UX/UI 스터디그룹) 학생대표 ‘색채 원리를 적용한 모바일 게임 개발 프로젝트’ 참여 - 보조연구원 (한국콘텐츠진흥원 주관, 홍익대학교-브랜드업 산학 프로젝트) ‘색채 원리를 적용한 모바일 게임의 사용성 연구’ 논문 작성 - 주저자 (`2010 전국 대학생 디자인 학술대회 포스터 발표) 한이음 IT 멘토링 ‘스마트폰 분실 대책 시스템 1차 프로젝트’ 수행 2009 육군 제3005부대 만기전역 2006 홍익대학교 디자인영상학부 입학 2004 숭실고등학교 졸업 1985 경기 부천 출생
  • 4. Contents UX Design & Research 색채 원리를 적용한 모바일 게임의 사용성 평가 / 사용성 평가. 2011 OS vi - Smart Pad UI Design / 모바일 UX설계. 2011 PhoneFinder / 웹+모바일 UX설계. 2010-2011 모바일 한게임 홈페이지 화면설계 / 모바일 UX설계. 2011 테라 공식 홈페이지 커뮤니티 개선안 설계 / 웹 UX설계. 2011 UI Design 홍익대학교 사이버강의 어플리케이션 / 모바일 UI 디자인. 2010 당신의 여권, 안녕하십니까? / 웹 UI 디자인. 2010 Other Design Works 상상마당의 인포메이션 네비게이션 디자인 / 편집디자인. 2009 인간무기체계발달사 / 인포그래픽, 모션그래픽. 2010 無印良品, 原硏哉 (무인양품, 하라 켄야) / 편집디자인. 2010
  • 5. A Study on Usability of Mobile Games Using Color Theory 2011 디자인 연구논문, 사용성 평가 주저자 / 학생 3명, 지도교수 1명, 35% *IJCD 2011 포스터발표
  • 6. 색채 원리를 적용한 Research Paper Usability Test Team Work -Primary Writer, 35% A0 Print (Poster), Paper 모바일 게임의 사용성 연구 2010 색채 원리에 대한 게임 규칙으로서의 사용 가능성과 이와 관련한 게임 사용성의 문제를 도출하는 프로젝트 색상 및 명도 구분 게임 3단계 명도로 나눠진 블록을 동일 색상의 명도 순으로 맞춰 블록을 없애는 게임 색상 혼합 게임 상어를 피하면서 물고기의 색을 제시된 해초의 색과 같아지게 먹이를 먹어 혼색하는 게임 색상 및 명도 구별 게임 다양한 색과 모양의 패턴을 제시된 모양과 색상 및 순서로 맞추는 게임
  • 7. 평가 개요 공통 평가 항목 세부 평가 항목 평가 일시 : 2010년 8월 25일~26일 평가 대상 : 8명 (미술 전공자 4명, 비전공자 4명) 평가 방법 : PC의 시뮬레이션을 통한 관찰 및 인터뷰 색채 원리의 이해도 색상 및 명도 구분, 혼색 학습 효과 평가 후 색채 원리 습득 여부 게임의 적응성 게임 난이도의 적합성 / User Type 별 게임 적응도 조작의 용이성 조작 방법과 사용자의 기대 간 일치 여부 / 피드백의 즉각성 및 적합성 GUI 그래픽 요소의 배치 및 기능의 명확성 / 메인 메뉴 구성 요소의 적절성 게임의 재미 게임의 동기 부여 / 게임의 참신성 및 흥미도
  • 8. 게임 UI 및 색채 이론 활용 가이드 Hard (Hard) (Easy) Easy 색채 원리 : 명도 색채 원리 : 혼색 색채 원리 : 색상 중명도 이하로 색상을 구성해야 1차색(순색) 중심의 혼색을 주로 사용하고, 색상환 상에서의 거리를 조절하여 사용자들이 쉽게 구분할 수 있다. 2차색(혼합색) 간 혼색은 고난이도에서 적용한다. 게임의 난이도 요소로 사용할 수 있다. 비교색이 색상환에서의 거리가 가까울수록 난이도가 높아진다. 도움말 피드백 동기부여 게임 진행 방식에 대한 도움말과 더불어, 미션을 달성하거나 실패할 경우, 점수, 반복성과 같은 게임적인 요소를 통해 각 게임에 해당하는 색채 원리에 대한 제한시간이 소진되어 가는 경우 및 사용자의 흥미와 지속성을 유발하는 것이 기본적 설명을 제공해야 한다. 게임 조작이 틀렸을 경우에 대한 선행되어야 한다. 명확한 피드백이 있어야 한다.
  • 9. OS vi Smart Pad OS UI Design 2011 모바일 UX설계 학생 2명, 40% *졸업작품
  • 10. OS vi Mobile OS UX Design 2011 Team Work -40% 1024*768 Smart Pad Smartpad OS UI Design 기존과 다른 스마트패드용 바탕화면부 UI를 제시하여 새로운 사용자경험을 제안하는 프로젝트
  • 11. 사용하려는 상황에 맞는 어플리케이션 추천 및 분류 “Situation” / Concept 마켓, 웹검색 연동을 통한 확장성 증대 내부 컨텐츠로의 접근성 확보 Widget Lock Screen Smart Market Search Smart Sorting Page Page External Suggest Contents Apps Task Web Internal Manager Informa- Contents tion / 접근성 + 확장성 / 편의성
  • 12. Information Architecture Wireframe Network Battery Network Battery Network Battery ama 12:00 Project Review Widget #2 Title 14:30 - 16:30 Content Market Widget #1 Title Widget #2 Title Folder Folder Folder Folder Folder Folder Disconneted Wi-Fi Connect Wed, Sep 14 Content Content Widget #1 Title App. Name App. NameA pp. Name App. Name App. NameA pp. Name Add Market Content App. Name App. Name NameA App. Name pp. Genius Result App. NameA pp. NameA pp. Name App. Name App. Name App. Name NameA App. Name pp. NameA App. Name pp. App. Name Information App Name App Name Category: Books Updated: Apr 13, 2011 Version: 1.1.1 App Name Size: 701.11 MB App. NameA pp. NameA pp. Name App. NameA pp. Name Search Page Slide to Smart Page Language:Name App Name App. Name NameA pp. English App. NameA App. Name pp. Genius Seller: Amazon App Name Provider App Name App Name App. NameA pp. NameA pp. Name App. NameA pp. Name App. Name NameA App. Name pp. NameA App. Name pp. App Name App Name App Name App. NameA pp. NameA pp. Name App. NameA pp. Name App. Name NameA App. Name pp. NameA App. Name pp. App Name
  • 13. PhoneFinder 스마트폰 분실 대책 시스템 2010-2011 서비스 기획 / 웹 및 모바일앱 UX 설계 / 웹 및 모바일앱 UI 디자인 멘티 / 학생 4명, 지도교수 1명, 35% *한이음 IT 멘토링
  • 14. PhoneFinder Service Planning Web + Mobile App UX Design Team Work -50% 1024*768 / 480 * 800 Web / Smartphone 스마트폰 분실 대책 시스템 Web + Mobile App UI Design 2010-2011 웹과 연동 가능한, 스마트폰을 분실했을 때 쉬운 회수와 개인정보 보호를 돕는 서비스 기획 및 디자인. 컴퓨터공학과 학생 2명 + 디자인과 학생 2명으로 2개 팀 구성 1차 프로젝트 : 2010.11 - 2010.12 / 서비스 기획 및 화면설계 2차 프로젝트 : 2011.1 - 2011.5 / 화면 디자인 및 개발 서비스 컨셉 : 나 화나면 무섭다 스마트폰을 분실하였을 때, 대책을 단계적으로 설정할 수 있도록 한다. 이를 통해 분실 상황에 맞추어 단계별로 행동 방안을 달리하여 대응할 수 있도록 한다.
  • 15. Information Architecture Service Taskflow 웹사이트 및 모바일 어플리케이션 정보설계 사용자의 서비스 이용 흐름 및 주요 과업 설정 Wireframe 웹사이트 및 모바일 어플리케이션 상세설계
  • 18. 모바일 한게임 홈페이지 및 프로모션 제안 2011 모바일앱 UX설계 학생 7명, 20% *NHN UXDP 2011 수행 프로젝트
  • 19. Mobile Web UX Design Team Work 640 * ??? 모바일 한게임 홈페이지 화면설계 2011 -20% Smartphone 한게임 모바일웹의 UX 설계 서비스 기획 기존 한게임이 갖고 있던 게임 채널링 역할을 확장하여 모바일웹에서의 게임 관리 기능을 통해 컨텐츠의 지속적 소비 및 매치메이킹 유도
  • 22. 테라 공식 홈페이지 커뮤니티 개선안 설계 2011 커뮤니티 UX설계 개인작업 *NHN 게임UX팀 인턴쉽 수행 프로젝트
  • 23. 테라 공식 홈페이지 Community UX Design 2011 Individual Work 1024 * ??? Web 커뮤니티 개선안 설계 테라 공식 홈페이지(tera.hangame.com)의 WCMS 개선안 설계 리서치 문제점 분석 테라 공식 홈페이지 커뮤니티의 문제점 파악을 위해 기존 테라 공식 홈페이지 커뮤니티의 문제점을 게임 내 사용자를 대상으로 인터뷰 및 공간, 주목도, 사용성 측면에서 분석 게임 웹진 등 벤치마킹 UX 전략 공간, 주목도, 사용성 개선을 위한 UX전략 제시 1단계 : 이용 목적에 맞는 명확한 방향 제시 2단계 : 커뮤니티 내 정보의 확대 및 재생산 지원 3단계 : 유기적인 커뮤니티 사용 흐름 조성
  • 24. 주요 개선안 설계 토론게시판 : 게시판 카테고리 추가, 쉬운 토론 참여 방식 제시 스크린샷게시판 : 베스트 게시글 영역 추가
  • 25. 테라지식iN : 베스트 답변 개선, 질문하기 입력필드 추가 게시글 댓글 내부 : 베스트 댓글 및 댓글 정렬 기준 개선 테라 통합검색 : 정보설계 및 검색결과 출력 방식 개선
  • 27. 홍익대학교 사이버강의 어플리케이션 Mobile App UI Design 2010 Individual Work 1024 * 768 Smart Pad 홍익대학교 사이버강의 스마트패드용 어플리케이션 디자인 리서치 서비스 컨셉 : 스스로 배우기 사이버강의 수강생을 대상으로 사이버강의의 참여율을 높이고, 사이버강의 이용 만족도, 수강 집중도에 대한 인터뷰 자신이 수강한 과목과 연계된 교육 컨텐츠로의 접근성 향상 디자인 포인트 컬러코드를 통한 네비게이션 단계적 접근을 유도할 수 있는 인터페이스
  • 28. 01_ 마이홈(개강 이전) 02_ 수강계획서 작성화면 03_ 수강계획서 확인화면 04_ 마이홈(개강 이후) 05_ 강의 보기 화면 06_ 수업보고서 작성 및 제출화면
  • 29. 당신의 여권, 안녕하십니까? 2009 웹 UI 디자인 개인작업 *수업과제
  • 30. 당신의 여권, 안녕하십니까? Web UI Design 2009 Individual Work 1024 * 768 Web 여권 분실 현황을 알리고, 경각심을 불러 일으킬 수 있는 사이트 디자인 서비스 컨셉 : 퍼즐게임 국가 별, 날짜 별 여권 분실 신고 접수 현황을 보석 퍼즐 게임처럼 나타내어 색상에 따라 심각성을 알릴 수 있는 디자인 상단 인디케이터 드래그를 통한 다른 날짜 조회하기 각 구슬에 마우스 오버 시 나타나는 세부 현황
  • 31. 상상마당의 인포메이션 네비게이션 디자인 2009 네비게이션 디자인, 편집 디자인 개인작업 *수업과제
  • 32. 홍익대학교 사이버강의 어플리케이션 Mobile App UI Design 2010 Individual Work 1024 * 768 Smart Pad 상상마당의 네비게이션 디자인 제안 리서치 사용자 집단 구분 필드스터디 및 컨텐츠 네비게이션 위주의 고정 방문자와 방문객 대상으로 인터뷰 수행 출구 네비게이션 위주의 첫 방문자로 분류 디자인 컨셉 : 당신을 설레게 하는 상상 호기심을 증폭시킬 수 있는 컨텐츠 네비게이션 쉽고 빠른 출구 네비게이션
  • 33. 브로슈어 : 고정된 정보 안내 쪽지 : 컨텐츠 네비게이션 고정된 정보에 호기심을 가질 수 있도록 유도 점층적으로 정보를 제공하여 호기심 자극 컬러코드 : 출구 네비게이션 유사 속성의 컨텐츠 이용 공간을 컬러코드를 통해 빠른 접근 유도
  • 35. 인간무기체계발달사 Infographic Motiongraphic Individual Work A3 / 720*480 Print / Video 2010 인간의 무기 발전 역사를 조명하는 프로젝트 디자인 컨셉 : 바퀴벌레 Infographic 끈질긴 생명력과 카니발리즘을 가진 바퀴벌레를 소재로 인간의 잔혹함을 순화하여 표현 디자인 포인트 무기라는 딱딱한 소재를 쉽게 표현 카툰 식의 애니메이션으로 심각한 주제의 희화화
  • 38. 인간무기체계발달사 Editorial Design 2010 Individual Work 410mm*410mm Print 하라 켄야의 디자인 철학에 대한 내용을 담은 편집디자인 디자인 컨셉 : 백 하라 켄야의 디자인 철학을 레이아웃에 적용하여 여백의 미를 강조 Design