social game ux test ( with gameloft)

UX test with Gameloft

Xiaoye Lin

www.ailain.net

www.linx108.com (Chrome please)

www.dribbble.com/fermaigh

Portfolio:

Name:

Please list your favourite UX design tool:In order of expertise

Pen/PaperAdobe toolkit: PS, AI, AE, ID, FLKeynote

Three mobile or social games were release in the last 2 years that I have personally enjoyed from a UX perspective and why

1. OLO game (IOS)

April 2013

The gameplay fits the game. Visually simplicity and consistency, little interference allows player to focus on playing. Information is well organised. Transition is smooth and less time-consuming.Some features impress me. For instance, a skeleton finger shows up unpredictably, which makes me feel like I am playing with a non-human ( maybe a skeleton man), so I would like to play more in order to figure out who else I will play with.fast to learn and good time killer ( it is waiting for me to play and not me waiting for playing it)

2. Wide Sky (IOS)

Jan 2013

Great animation makes the loading/waiting less boring.Progress visualisation for both quick and detail tutorials.Smooth transitions and beautifully animated for almost everything.Thoughtful tips written cleverly right there on screen help the player, tell them what to do.Fast to learn and a good time killer ( waiting for me to play and not me waiting for playing it)

3. Letterpress (IOS)

Oct 2012

Smooth transitions make me enjoy playing. Preview on score makes me comfortable.Visualisation on what letters had been used by each other and what should be used to win the game. Intuitive menu and interface

Pick two of the following games and tell us (and be specific) what you like about the UX, what you don’t like and how you would you improve it.

Clash of Clan, CSR Racing, Ice Age Village, Zombiewood

What is good

Good tutorial

What is good

Bonus window show upin the beginning

Close window until OK is clicked,which makes the information more memorable

What is good

Thank this for making the interface clear

What is good

notifications

What is not good

loading is too time consuming

What is not good

Not obvious

What is not good

Not consistency

What is not good

Clicked collection, but it gives player inventory.

What is not good

The player is tired of moving around again, can the control bar just lower itself a little bit?

What is good

Loading is super boring

What is good

Visualisation consistently

Dynamic menu based on active object

What is good

What is good

Obviousand red color as background, is visuallyconsistence with close button.

grey for locked or disabled item

In first image, more helpful tips provided to unlock

What is good

Shortcut to add

What is good

Notification

What is good

Selecting row makes life easy

What is good

What is good

Ask before making an important decision

What is good

Good to have a navigation

What is not good

Why not navigations for them too

What is not good

Problematicinformationhierarchy.

For example,setting may be usedless frequently thanothers.

What is not good

It can not define an available positionautomatically.

In this case, place a tiny item manually is hard, especially when items clusters.

What is not good

The troop bar is not updated in realtime. It bothers player in some cases.For example, during the battle, if there is no more soldier left, the players has to go back even there is a troop, because the new trained soldiers can not be added automatically.

What is not good

Why not a shortcut to collect all the resources?

What is not good

Why this happensI cant read, it is a mobile screen

What is not good

Why this happenswhat I am gonna do?

What is not good

The control bar should be smart enough to define a proper position, can them lower a little bit, try to be in the middle of the screen so that the player don’t have to move around again.

What is not good

Hardly tell there is a chat window hidden there?

Take a major UX component from one of the two games you chose above that you would like to improve, please design a better and more usable User Experience flow and interface. Use whatever design tools you prefer to create mockups and flows that get access your vision and be sure to tell us why you made the choices that you did.

get resourceanything else

Current resource

notifications

Overall

Information architecture

Loadingwith play tips

Main screen

Level #

AccountLeague

Defence/attack log

Shieldwith time#

Chat & inboxwith

notification#

Achievementswith

notification#

Anythingelse

Setting Friends

Resources

Attack

Shop

Builder

Coin

Elixir

Store

Press Icon to open a bar

Press Icon again to close the bar

Press bar to open league screen ( goals)

Press bar to open attack and defence history screen

Press icon to open the shield bar

Message inbox and chat window

Achievement screen

Slide from left to right to open anything-else bar

Press Icon to open attack screen

Press Icon to open store screen

Press Icon to open store bar

Press Icon to open elixir bar

Plus icon, as a short cut to collect all the available elixir

Overall design descriptionI started with the analysis from just playing the game. First, I figured out what information hierarchy is: what is urgently encourage player to do, what is good to have the players to know, what are just suggestions, what does not matter too much. I listed them from an order of most to least important, meanwhile, in term of the iphone 5 screen,I figured out where the best/good spots to touch are, and then tried to have the information matches the right spot. Also, I tried to free more spaces too.

I redesigned some of the icons. The original icon for “attack” is “Map”, which makes the player misunderstood, compare to MAP, swords make more sense.

Designing in the perspective of a player, even in a perspective of a player who has little interests about this game, asked myself when I was designing: “ Is it fun/clear/comfort the new users or players who get bored easily?”

Adding shortcut for collecting resources, it may be more useful for those advanced players who have their resources all over the places. All they need to do is just click the “plus”, they dont need to move around the screen.