Presentation is loading. Please wait.

Presentation is loading. Please wait.

Wireframes Mobile App – v2 LSTK Ltd. – July 2015.

Similar presentations


Presentation on theme: "Wireframes Mobile App – v2 LSTK Ltd. – July 2015."— Presentation transcript:

1 Wireframes Mobile App – v2 LSTK Ltd. – July 2015

2 Overview User Journey – Game Update User Journey – Message

3 User Journey – Game

4 Dashboard v2 – Game nickname ### games played #’### credits current games game title turn ## / ## nickname ##h##min left game title turn ## / ## nickname ##h##min left start a new game messages game title## days ago message: lorem ipsum… 1.Game update involving another player a)left, rounded-square: Game. descriptionImageURL b)top right, badge: Challenge status i. : Game invitation ii. :this Player playing iii. :this Player assessing [Alt: iv. :new in-Game message v. :other update (e.g. status changed) c)lower right, round: Player. avatarImageURL i.Game invitations ii.Other Player playing iii.Other Player assessing iv.Other Player message v.NOT for this Player playing / assessing player avatar LSTK icon game image 1a 1b player avatar 1c player avatar

5 Overview User Journey – Game Update User Journey – Message

6 User Journey – Messages

7 Dashboard v2 – Messages nickname ### games played #’### credits current games start a new game messages nickname## days ago message: lorem ipsum… nickname## days ago message: lorem ipsum… 1.Buddy invitation a)left, round: Player. avatarImageURL b)top right, badge with “?” 2.private message from buddy a)left, round: Player. avatarImageURL b)top right, badge with number of unread message from this buddy (1- 99, then “…”) player avatar LSTK icon 1 player avatar player avatar ? # 2

8 Message Details 1.Copy with pride “WhatsApp” a)take camera out of entry field, next to microphone b)camera & microphone disappear when someone starts typing (same as WhatsApp) and show post arrow c)time format Same day: 19:47 Older: Thursday, July 30 d)color to be adjusted with LSTK styleguide

9 Discussions nickname## days ago message: lorem ipsum… nickname ## days ago message: lorem ipsum… nickname ## days ago message: lorem ipsum… nickname ## days ago message: lorem ipsum… 1.Buddy invitation a)left, round: Player. avatarImageURL b)top right, badge with “?” 2.private discussion from buddy, with new message a)left, round: Player. avatarImageURL b)top right, badge with number of unread message from this buddy (1- 99, then “…”) 3.private discussion from buddy, NO new message a)left, round: Player. avatarImageURL b)no badge <Messages icon 1 player avatar player avatar ? # 2 discussionsbuddies player avatar 3 player avatar

10 Player Details (not buddy) 1.same as Player details (not yet buddy) player nickname, ## ### games played likeignore preferences some preferencevalue lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sit amet iaculis orci. some preferencevalue lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sit amet iaculis orci. player avatar <nickname advertizing area icon 1

11 Buddies List 1.same as buddies list a)only add tab navigation on top nickname ## games played together nickname ## games played together nickname ## games played together <Messages icon discussions buddies player avatar player avatar player avatar 1

12 BACKUP

13 User Journey


Download ppt "Wireframes Mobile App – v2 LSTK Ltd. – July 2015."

Similar presentations


Ads by Google