한상욱 ui디자인 포트폴리오
TRANSCRIPT
1. Airelive 분석
Airelive는
UI Flow
문제점
2. Solution
Key Idea
Concept Design
3. Final Format
RE-UI Flow with UX
RE-GUI
Simulation
1. Airelive 분석
Airelive는
UI Flow
문제점
2014년 11월 부터 서비스.
모바일 기반의 영상 커뮤니케이션 시스템.
2백만명이 사용중임.
주기능은 모바일 개인 방송과 화상체팅 서비스 그리고
블로그 기능 포함.
1. Airelive 분석
Airelive는
UI Flow
문제점
app icon
Loading page
Time line option Notice Face chatting option
Alram settingNick name SMS Email
Add friend to chat Find friend
Friend menu
live studio
open live
comentpage
10sec video video message photo video
Option Store Setting
Time line Face chatting Function page
My home page
Contect Airelive
1. Airelive 분석
Airelive는
UI Flow
문제점
유저 페이지로
가는 단계의 복잡함
명확한 컨셉이
없는 디자인 & 레이아웃
카메라의 높은 성능에
불구하고 작은 화상화면
게시물 터치시 한번에
너무 많은 정보 제공
사용자 블로그 항목중
내용/ 기능 중복 항목 발생.
친구 터치시 많은
기능들의 List up
Key Idea
Concept Design
2. Solution
live사용자가 위치한 도시와 시간 별로
바뀌는 백그라운드 사진
유저가 위치한 지역의 하늘과 전경을
보여줌으로 서비스를 통한 ‘내가 있는
장소와 나의 관계’를 부각시켜줌
Close toFriends
친구의 페이지로 들어가면 친구의 장소와
시간대의 하늘로 배경이 바뀜
기존의 체팅과 전화가 시공간을 뛰어
넘는 ‘기능’을 제공한다면,
배경의 변화는 친구와의 공간을
공유하고 시간을 공유하는 단계.
친구가 위치한 지역의 핫한 뉴스피드를
볼 수 있으며 이를 통해 도시/장소의
커뮤니티에 참가할 수 있음
AirAir라는 단어에 알맞게
투명한 느낌을 제공
얕은 심도와 느낌으로 마치
공기층을 밀고 당기는 경험
제공
SkyKey Idea
Concept Design
2. Solution
사용자가 위치한 공간의 하늘을 담다.
3. Final Format
RE-UI Flow with UX
RE-GUI
Simulation
home timeline
notice search
tag nick name
time linebasic
Issue people
option
chatroom
option friendslist
View
frined’s timeline
Follower/
Following List
facechat
grouplive
open live
videophoto
videomessage
10secmovie
followerfollowing
Posts
invite option
chat &broadcasting
go to camera
list
chatsetting
cammeraalbum
cammeraalbum
edit & posttag &text
setting
chat/friends
aire live aire livetime!
my page
1. 나의 페이지를 가는 단계 조정
- 상위 항목으로 이동
2. 친구 페이지와 게시글 찾기 페이지 위치 조정
-친구 항목에서 친구를 찾고 추천받는
-타임라인 페이지 내에서 서치 버튼 제공
3. 새로운 서비스 제공
-친구가 위치한 장소와 시간을 공유하는 기능추가
find friends
친구가 위치한 지역의 핫한 뉴스피드를
볼 수 있으며 이를 통해 도시/장소의
커뮤니티에 참가할 수 있음
3. Final Format
RE-UI Flow with UX
RE-GUI
Simulation
App Icon
Log-in page Loading page
home loading
3. Final Format
RE-UI Flow with UX
RE-GUI
Simulation
Time line Chat& Friends
Aire live(post sevice)
Airetime! My page
timeline
chat/friends
aire live aire livetime!
my page
3. Final Format
RE-UI Flow with UX
RE-GUI
Simulation
Time line Face Chat Aire live(post sevice)
Airetime! My page
게시물 종류에 따른 레이아웃 조정 가능.
원하는 부분터치 시 해당하는 기능제공.
(말풍선 터치시 댓글쓰기,읽기 제공)
화상체팅시 참여자의 수에 따른 화상
레이아웃 조정 가능.
친구 터치시 나오는 기능 List up을
간소화.
(Airelive에서 제공하는 기능)
직관적인 UI제공.
여유로운 레이아웃 제공.
상단 중앙에 내가 위치한 도시의 사진과
시간.
하단에는 친구들이 위치한 도시와 시간을
제공.
친구 클릭시 해당 도시의 뉴스피드 및
화면 제공.
중복되는 기능 회피.
내가 올린 시간을 기준으로 게시물 정렬.
3. Final Format
RE-UI Flow with UX
RE-GUI
Simulation
3. Final Format
RE-UI Flow with UX
RE-GUI
Simulation
“가끔씩 하늘을 들여다보면
그 멋진 모습과 광경에 행복할 때가 있습니다.”
“새로운 경험을 제공하고
그 경험을 친구들과 나눌 수 있는,
공감할 수 있는 디자인을 그립니다.”