Mobile App: Homepage (Game Mode Selection) Iteration 4

[soeanski]

Design Goals

• Minimize cognitive load of new users
• Make habit-forming easy
• Element that is extendable for future addition of game modes
• Sharp interaction, easy-to-use for old and young players
• No effort to get in-game for new users
• Minimal effort to get in-game for returning users
• Familiar feeling for new users (recognizing catan board)

User Needs

• Get into a game fast
• Know what each game-mode is about
• Safe environment, not being overwhelmed (new users)
• Have all choices of colonist.io website

Solutions

Solution 1

Conclusion

Proposed Solution: Solution 1

Benefits: This design is based on what @samgawaran created here here and offers the same benefits. Additionally, it is now possible to get into any game mode with one tap on the Play Button. New players will have an easy time getting into their first experience (the configuration of which we can control pretty well) while veterans still have the ability to configure exactly what they are looking for. The general layout of the homescreen was also changed a bit in this design but has no influence on the game mode selection + Play Button.

Note: This design was intentionally layed out for 9:16 aspect ratio. It will fit on the smallest android devices and still look good on modern screen aspect ratios and pixel densities.

Potential Risks: The Illustration for Create Game could be optimized. It does not have the same quality as the other two.

Figma link: Figma Prototype

Considered

• [ ] This proposal fits company vision
• [ ] This proposal is impactful according to Prioritizer Sheet
• [ ] This submission abides by Des-lvl-1, Des-lvl-2 & Des-lvl-3

Reviewers

[Esqarrouth]

This design fails to address these:

• Minimize cognitive load of new users
• Sharp interaction, easy-to-use for old and young players
• No effort to get in-game for new users
• Get into a game fast
• Safe environment, not being overwhelmed (new users)

I'm a bit overwhelmed by the stuff in there.

1. There are way too many buttons: become a member, information, settings, left/right, play
2. There is just too much text in inconvenient places, my eye has to go up down up down to be able to take it all in
3. There is the 2nd screen which I don't understand what it's about, can't we swipe right for new game modes?

[soeanski]

Minimize cognitive load of new users

I agree, the display for Game Mode and Ranked/Unranked adds a bit of complexity. Maybe too much.

Sharp interaction, easy-to-use for old and young players

Honestly I don't think a carousel could be any sharper than this. Could you point out what you think is not good enough in terms of usability

No effort to get in-game for new users

It is exactly 1 tap.

Get into a game fast

It is exactly 1 tap.

Safe environment, not being overwhelmed (new users)

Yes, agree.

1. There are way too many buttons: become a member, information, settings, left/right, play

Agree, needs to be reduced.

2. There is just too much text in inconvenient places, my eye has to go up down up down to be able to take it all in

Thanks for the feedback, will try to improve on this. When exactly did you have a hard time scanning the content? Where you looking for something or just the first glance that is not easy?

3. There is the 2nd screen which I don't understand what it's about, can't we swipe right for new game modes?

Did you open the Figma prototype?

[soeanski]

Adding to my comment above, this is what a slightly different version would look like on an iPhone X.

[Esqarrouth]

Minimize cognitive load of new users

I agree, the display for Game Mode and Ranked/Unranked adds a bit of complexity. Maybe too much.

How could we reduce that?

Sharp interaction, easy-to-use for old and young players

Honestly I don't think a carousel could be any sharper than this. Could you point out what you think is not good enough in terms of usability

Why does it have to be a carousel?

Learnability: Instead of seeing and clicking, they'll have to dig through to find a mode they like to play Efficiency: Not efficient Memorability: Orders might be missed but generally memorable Errors: They will slide one less or extra, etc.. Satisfaction: Probably fun to use

No effort to get in-game for new users

It is exactly 1 tap.

Get into a game fast

It is exactly 1 tap.

What about finding, searching?

Safe environment, not being overwhelmed (new users)

Yes, agree.

How could we give them a safe environment?

2. There is just too much text in inconvenient places, my eye has to go up down up down to be able to take it all in

Thanks for the feedback, will try to improve on this. When exactly did you have a hard time scanning the content? Where you looking for something or just the first glance that is not easy?

All glances are not easy. The types of important content are all scattered around, not collected in a single place

3. There is the 2nd screen which I don't understand what it's about, can't we swipe right for new game modes?

Did you open the Figma prototype?

I opened it now and I'm even more confused