Case studies / Writing gamification platform
Illustration

Redesign of an engaging writing game in close collaboration with users

Gamification
Writing
File management
B2C
Duration 6 months

Through our conversations with users and detailed feedback at every stage of the design process, we gained insights into users' motivations and needs that resulted in the perfect balance between the writing and gaming aspects of the product

Illustration

Project Roadmap

1
UX Research
Competitor Research
Information Architecture
User Survey
User Interviews
User Flow
2
UX Prototyping
Brainstorming
Wireframing
Prototyping
User Testing
3
UI design
Moodboarding
Visual Design
UI Kit

Getting to know the System

Many writers strive to write every day, but struggle to get it done. To help them find motivation, our client invented a game for writing.

The game has a large community of writers who have been using the system every day for several years. However, the system also had some usability issues which descreased the retention of new users. That’s why the client reached out to our agency to improve the user experience and help them attract more users.

Project Challenges

Level up the usability
Level up the usability
Make the system intuitive and easy to use
Fusion of experiences
Fusion of experiences
Find the right balance between convenient writing and fun gaming
Diverse community
Diverse community
Make the system convenient even for seasoned users
Immersive illustrations
Immersive illustrations
Build UI in synergy with existing illustrations

UX Research

We combined quantitative and qualitative research methods to gain different insights into the current user experience. Then we structured the gained knowledge into simple diagrams to use them for the research-driven design decisions

Services
Stakeholder Interview
Our first goal was to understand the project, so we set up an initial call where we discussed all the project details and defined our first steps
Services
Competitors Research
We analyzed the product competitors to get familiar with common patterns, and define which decisions can be reused and which should be avoided
Services
User Survey and User Interviews
We created a survey to learn about users’ priorities and needs. Then we talked to some of them to truly understand their experience

Information Architecture

We created diagrams of all the data present in the system and its hierarchy. This helped us build the right components and group the information in a meaningful way

Product Map

User Flow

After we talked to the users of the platform, we gained insight into their behaviour. Based on this knowledge, we built a diargam of all tasks and actions in the system. We used it to build an engaging solution for users and help them achieve their goals effectively.

Product Map

UX Prototyping

After we gathered all the necessary information on the research stage, we started creating wireframes of the new system layout. We were building an interactive prototype module-by-module with the client to gather feedback from the actual users

Onboarding

One of the main client’s business goals was to retain more customers. During the research stage, we discovered that the new users get lost in the system and don’t know how to get started. That’s why we created an interactive onboarding to show users what they can do in the system.

Onboarding

Dashboard

The issue of the existing platform was a lack of a starting page. New users got confused and didn’t know where to start. To solve this issue, we created a customizable dashboard which includes shortcuts to the main website modules. This helps increase user engagement with different parts of the system.
As a result
Writing

An important thing about the system is that it’s not just a game but also a writing tool.

However, the previous design had some usability issues, so the users preferred using other writing software and copy-pasting words to defeat monsters and win rewards.

To improve the user experience, we found a more flexible way to organize files and made the process of writing more convenient.

Writing

UI Design

After each module had been approved, we defined a visual language and structured it into a design system. UX and UI designers were working in parallel to provide the client with a solid function-oriented interface, while keeping a high level of quality

Illustration

Our Design System Structure

Our Design System is a collection of shared patterns. This System allows the team to build quality consistent interface of the application now and with new future modules to come.

UI Design
Basics
UI Design
Elements
UI Design
Components

Basics

Basics are the simplest entities – colors, typography system, buttons, icons. We opted for a dark theme for better immersion and clear personalised call to actions.

Basics

Elements

With the set foundation, we developed a balanced unity between a professional tool for writing and a game. Clickable cards became invitations to unique worlds, and CTAs consistent and minified links.

Elements

Components

With a range of elements inside the application, our team has developed a predictable interface surving as a container for different kind of information

Components

As a result

As a result
As a result
As a result
As a result As a result

Happy client
is our routine

Our client
The results so far have been fantastic! We shared a preview of our work with our community and even drastic changes got ratings of 9/10 and higher. Because the redesign hasn't been launched yet we don't have more concrete results, but one of our major goals of the redesign was to have a complete design system we could keep at the end of our work together. Angle2's team are extremely organized and the system they are creating will benefit us internally greatly.
Eduardo Loria CEO
Consistent design
Consistent design
We have created a Design System from which product now will grow and help writers be more efficient
Fusion of experiences
Fusion of experiences
We have created a very comprehensive product that combines elements of a professional tool and a game
Happy community
Happy community
Redesign of the system made the large community excited and supportive for an upcoming changes

Our perfect team

https://angle2.agency/wp-content/uploads/OK.png

Olha Kirdiaieva

UX Designer

https://angle2.agency/wp-content/uploads/AS.png

Antonina Shalaieva

UX Designer

https://angle2.agency/wp-content/uploads/3-5.jpg

Eugene Yaroshenko

UI Designer

https://angle2.agency/wp-content/uploads/OB.png

Oleksandr Belkin

Project Manager

We're
all ears

Fill out the form to start the conversation — we’ll get right back to you

    Amazing!
    Thank you so much!
    See you soon
    This Website uses cookies

    We use cookies to recognise your device and save the actions you have previously made on the Website, to prevent any malicious actions against the Website and its users, to improve users’ experience as well as to ensure the proper functionality of the Website.

    For these reasons, we may share your usage data with third parties defined in our Cookies Policy. By clicking “Accept all cookies”, you consent to store on your device all the technologies described in our Cookies Policy and Privacy Policy, while by clicking “Decline unnecessary cookies”, you decline to store on your device marketing and analytical cookies. You can change your cookie settings at any time by clicking “Cookies settings”.

    Please click on “Cookies settings” to see further information.

    To find out more about the categories of personal data collected and the purposes for which such data will be used, read our Cookie Policy.

    Cookies settings
    Decline unnecessary cookies
    Accept all cookies
    Cookies settings

    We use different types of cookies to optimise your experience on our Website. Click on the categories below to learn more about their purpose. You may choose which types of cookies to allow and can change your preferences at any time. However, be aware that if you choose to refuse or remove cookies, this could affect the availability and functionality of the Website. You can learn more about how we use cookies by reading our Privacy Policy and Cookie Policy.

    We use cookies in accordance with Article 6 GDPR based on the following grounds:

    a) consent of the user;
    b) legitimate interest of the Company.

    We collect the necessary cookies based on our legitimate interest, namely to ensure the functionality of the Website.

    Categories of cookies:

    First-party cookies are those cookies that are placed on the Website by the host of the domain, in particular Angle2 Agency.

    Third-party cookies are those that are placed on the Website by the domains other than the one the user is visiting. As a variety of features that are necessary to ensure the personalised and convenient experience of the user may not be delivered by the Website itself, the third-party cookies are used. We work with different third-party service providers in order to enhance your user experience and to analyse user behaviour on our Website.

    Third-party service providers may use their cookie files on our Website and you may find the relevant information about the use of cookies by them in their respective privacy documents. The list of the above-mentioned service providers is the following:

    c) Google Analytics;

    We only use cookies for the following purposes:

    Necessary Cookies

    We use these cookies to enable the functionality of our Website. You can choose to block Necessary Cookies in your browser settings. Nevertheless, remember, if you block Necessary Cookies, it may strongly affect the functionality of the Website.

    Statistic Cookies

    We would like to use them to understand how users interact with our Website (number of visits, behaviour) by collecting information anonymously.

    Marketing cookies

    These cookies and other tracking technologies are used to deliver relevant online advertising to you on other websites. These cookies are placed by us and selected third parties and enable adverts to be presented to you on third party websites.

    Necessary
    Statistic
    Marketing
    Confirm my choices
    Decline all
    Allow all
    Cookie Control Icon