Marvel WoH: My Page Revamp
Marvel:War of Heroes is a game created by developed by Cygames, powered by Mobage platform, took over by DeNA from May 2014. It is an electronic collectible card game (CCG) running on Android and iOS platforms. It had been stayed in the worldwide top 10 grossing games for more than 2 years, and the total download times exceeded 2 millions.
This mobile game was my first project that fully involved for 2 years. Today I would like to talk about the first challenge that I had done —— MyPage revamp and customization feature implementation.
Let's look at the previous My Page screenshot first:
● Top Menu bar
● Primary Card with 4 recent cards
● Level and XP
● Updates
● Initial Event
● Regular Mission and Battle button
● Dock menu bar
Disney/Marvel had given us some requests:
1. Introduce the avatar feature: each player will have their own customized avatar and background
2. futuristic style layout
Here comes our improvement procedure:
Previous My Page Usage Analysis
Check My Page related user feedback
Decide the new My Page components
Prototype Mock-Up
High Fidelity Design and keep UX consistency
Feature specification design
Game engineer implementation
QA and Internal test
Players test
Release! (Monitor feedback, performance and resolve minor bugs)
Recap
Further explanations:
1. Previous My Page Usage Analysis
a. Got the data from analyst team and checked the daily/weekly/monthly button usage of all the buttons on My Page and the top&bottom menu bars.
b. Created an analysis report for data usage based on the data
We found out that the highest usage buttons are:
Event button
Notification button
Alliance button
The big mission and battle button, few people using it.
Same as the cards panel, usage is very low.
2. Check My Page related user feedback through:
Social Media: Twitter and Facebook
Forum: Marvel War of Heroes neoseeker
Customer Service team
Regarding to users feedback on this screen, some of players complained that:
① They used the event banner most frequently but everytime they need to scroll to find that button.
② My Page is too long.
③ They want more features related with alliance (it's an in game team to play GvG and GvE events which were the most popular events).
3. Decide New My Page Components
Brainstorm meeting based on the mypage button usage report among the team members
Finalize the components list based on analysis report, user feedback and sales-driven ideas.
Our final list is:
1. * Avatar and Background - Disney/Marvel request
2. Custom Avatar and Background setting button
3. Primary card (1 card only)
4. Alliance
5. Level/XP
6. Ongoing event button/banner
4. Prototype Mock-Up
Based on the final list, I checked similar mobile games design and had the design left
5. High Fidelity Design and keep UX consistency
My prototype got approved by the managers and Disney/Marvel :)
Afterwards I moved on to pass the design to our artist team, created order sheets for them.
Here comes the final high fidelity design:
6. Feature specification design
Based on the feature requirement from Disney/Marvel side, I created the specification of avatar feature.
Since it is a totally new add-on feauture, I designed a simple tutorial for it as well.
Logical side: Specification and user flow in Cacoo
Back-end side: Created avatar and background item data tables, and updated user item tables
7. Engineer development phase
Explained all the details of this feature and kept polishing the specification.
8. QA and Internal test
Helped QA team members to test the implementation done by engineers.
Held an internal team member play test session to get feedback and suggestions.
9. Players test
Colleagues of other projects
Invited hard core players to help us test this feature and gave feedbacks.
Iterate the total design process until team satisfaction.
10. Release!
Monitor feedback
Monitor user performance
Standby to resolve bugs
At first I was afraid of complaints about the major change of My Page would be coming since users are too used to the previous design. Once released I kept monitoring the facebook comments and customer support channel. To my surprise, during the first week only 2 players complaints the big change of home 😄
11. Recap
Check the feature tutorial completion on each step
Check the user retention on this feature (Further on we released avatar and background items in upcoming events)
It was a huge pleasure to see most players were collecting their avatars and background items to frequently updating their My Page.
We did a similar revamp of user's profile page too.
