The design was developed in March 2021 and published first short process on Instagram
As Arknights players, every day we will see the main dashboard of the game every time we log in. When we access the main dashboard, there are many things that we can do, from finishing some stage to reading some stories.
Findings
But when in the dashboard, there are some things that are feeling off from what I see and can be developed to a better UI.
For the dashboard, I find some things that can be improved to meets the goal. First, the 🔃 icon seems unclear to the user at first glance, is it something to refresh the dashboard or to rotate the dashboard. Second, the ongoing banner information is not highlighted to persuade the player to pull on the banner. Third, the similarity content between free banners and paid banners is slightly different. Fourth, the minor adjustment on the contents to be better when using English copy.
From these findings, there’s still room for improvement on how to develop a better dashboard. Starting from the Information Architecture of the dashboard, we can find some points on how to manage the structure to help the information be better informed.
Information Architecture
Information Architecture(IA) helps to determine the fundamental information shown to the user. From here we can find a way or two on how we will layout the information in a screen by the information provided from the IA.
Here are my findings on how the game about the overall dashboard’s IA should be
From the IA, there is so much information that is shown to the user on the dashboard, some of it is already clear and minor readjustment on the recruitment content. By merging the recruitment button, users can access both contents with one click.
Wireframe & Design
After viewing how the IA’s dashboard is structured. Wireframing is one of the littlest efforts how the layout will be.
The layout isn’t far from the original one to prevent a new learning curve for the user. The change needs to be processed one by one for the user can adapt to the design. The hierarchy of the button is represented by the size of the button for the user to easily click the button on the dashboard.
The new design is implemented after finding the layout for the content. The design also uses some new visuals to differentiate the level of the button too. Some buttons need to appeal to the user above the other. For example, the store button’s color is blue so the button looks more appealing to the user and will drive the user to click and see it easily for them.
Besides the new UI visual, some of the pain points before also repurpose and change to attract and be easily understandable to the user. The banner is bigger to tell the user what’s ongoing in the game and the status above the banner as “Breaking News”. The recruitment is combined into one so users can access both contents in one button. Then, changing the edit button by using text to make less expectation on what will happen when the user clicks it. Minor adjustment for the English version game is to adjust the text to be fit in the game when there’s an event ongoing or not.
Thank you for reading until the end. That’s some finds I found for the dashboard. Please share and comment to talk more about the UI or the game itself.
