Telegram App Copy

Currently open for work

Liubov

An iOS App Marketplace For A High-Fashion Brand

#project-Ciel Noir

This project was commissioned by a client planning to launch a new home for their luxury marketplace - an exclusively iOS application. The brand wanted to maintain a classy, strong, high-end appearance for the app and make sure the user experience was smooth and seamless.

Summary

My contribution

As a UX/UI Designer, I focused fully on building the design system, wireframes, and a working prototype. By the end of the project, I delivered both low- and high-fidelity wireframes, a component kit, and a Figma prototype that outlined the app flow from registration to purchase.

Additionally, I conducted user research, testing, and review based on user feedback.

Services provided:

Figma design: wireframes, component kit
Art Direction: design and execution
React programming and database development
Competitor research, analysis, and comparison
User research and testing
Webflow development

Mission

Collaborated with

UX/UI Designers and Developers

My role

UX/UI Designer

Full working prototype

5 unique user interviews

This project called for an approach that integrated playfulness and gamification elements. After researching competitors and similar apps, such as Habitica, I settled on a hand-drawn look. As this app would be based in Telegram, I went for a casual-like gameplay.

As the result of competitor research, I compiled a document outlining each company's design decisions, their reasoning, and why it worked for them. Additionally, I researched main gamification strategies to create a product that would engage their users to come back.

Process & Strategy

Wireframe Development

Research & Structure

Having completed research, I moved to webflow development and wireframing. In my design and colour choices, I made sure to reflect the backstory of the game - a house in the woods, where a young girl, Seren, lives. To maintain this story, I chose warm tones and brown shades. As for UI, I focused on making the appearance cozy by making rounded corners, stylised icons, and subtle animations.

I created screen-by-screen wireframes for each section of the game. These included:

To-Do Screen with options to add, edit, remove, and complete tasks, along with Completed Tasks
Focus Timer with unlockable rewards, issued for a certain number of minutes spent focusing
Rewards Screen and minute counter until next reward
Pet Companion Screen - an opportunity to take care of a pet fox by visiting daily
Pet Shop - an opportunity to spend coins received through focusing and completing tasks

React Development & User Feedback

Using React, I built the app and integrated it in Telegram using a bot function and API. Users can interact with the bot to launch the app, review their rewards, and connect with the Gleamorrow community. During development, I focused on creating succinct, modularised code. For the database, I used Python and Railway hosting.

With more than 200 active users, I've been able to gather ample feedback and implement it.

One of the main issues for new users was unfamiliarity with the gaming process, which was described as 'sometimes frustrating' and 'too hard to figure out'. To mitigate this, I developed an onboarding process, which guided the players through the main features, and introduced an FAQ section, where each users could find tips and guidelines for play.