CustomDice

app redesign


INTRO

I wanted to improve the UX of the first app I published with what I’ve learned of UX/UI design in the past months.

The old design had flaws that I wanted to fix with a new design that didn’t differ a lot from the old one, thus the userbase wouldn’t feel lost.


RESEARCH

The userbase was the same that when I realeased the app, RPG players that need to create their own dices.

The feedback wasn’t bad at all. The users were able to do what they intended to, but the UX/UI could be improved.

The design needed to be more consistent and the sitemap more intuitive.


DESIGN

Objectives

  • - More consistent interface
  • - A better sitemap

Sitemap

To make the sitemap more intuitive I merged the submenus that I could into one, like the Create and Edit submenus, avoiding making unnecessary separations and making it simpler.

Old sitemap
  • -Main menu
    • -Creation
      • -Create new dice
      • -Edit dice
      • -Upload dice’s face
    • -History
    • -Calculator
    • -Options
      • -Change background


New sitemap
  • -Main menu
    • -Creation (create & edit)
      • -Upload face
    • -History
    • -Calculator
    • -Options
      • -Change background

Interface

I wasn't going to change the palette beyond making the colors less bright, so I just needed to change the shapes of the elements.

I also wanted to make the design flat so I deleted all the strokes, made the backgrounds rectangular with straight lines and made all the buttons have rounded edges.

And finally to make the creation menu clearer I added headers to each section, so the users won't have to guess which ones are the dices, icons or faces.

Old Design

CustomDice app on playstore

New Design

CustomDice app redesign figma

CONTACT

contact@plusultradev.com