href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
TheHeroLoop
Branding / Art Direction/ Research / UX / UI Design for multiple platforms
TheHeroLoop is a social platform based on intelligent and secure matching of people in need (Loopers) with help (Heroes) in local areas.
TheHeroLoop consists of a tight and diverse team spread out in both skills and locations worldwide. We all participate in standups every day to discuss progress, design problems, and business challenges.
Year:
2021-now
Role:
UX Designer
I have actively been taking part in shaping the direction of design and product development throughout my time at TheHeroLoop. Below I will showcase the many different challenges that I have encountered.
Research & prototyping
The different areas of the product have required slightly different methods of research depending on different requirement, aim, and previous work. However, below I will present the general cycle for most of the research I have done for TheHeroLoop.
I conducted user research and experimented with the flow of the layout for the business marketing app.
1.
RESEARCH
Research gives me a general understanding of what’s already out there; What are others doing and why? How are they handling similar types of data? As well as a general understanding of what motivates our potential users.
2.
CUSTOMER PROFILE & VALUE MAPPING
Inserting Insights from earlier research into empathy and journey map allowed us to develop a profile and a value map. Identifying pain points & how to potentially solve these.
3.
REVIEWING EMPATHY AND USER JOURNEY MAP
Are we addressing essential customer gains and pains? Where are gaps & opportunities? After reviewing the maps I formulated these insights into actionable implementations. This can be changing the current UI, creating new ones, adding functionality, or changing the narrative of a particular user flow. This is also where I think of how this new design will work with everything else in the app and our product as a whole and make sure it is still directed towards our goals.
4.
PROTOTYPING & TESTING
This is where we usually find out more things that we didn’t know before by experiencing the prototypes, getting feedback, and working with them to find the best solution.
Branding & Art Direction
When I started at TheHeroLoop, the logo and colors had already been decided. However, we needed to rethink the colors a bit, more specifically the color contrast for accessibility reasons. I choose the new deeper blue color as our primary color to reflect trust/reliability and for our secondary color, orange, as a way to communicate our kind-hearted and fun approach.
Component Library
I created a component library, allowing me to craft the interface of the product with speed. This also gives the development team all the basics and variations needed.
Product Design
1. Product features
2. UX and UI rework and designs
Mobile & Web App
Redesign of how to edit a task
What the redesign was supposed to improve:
- Clearer and easier way to quickly change task details.
- Unify the aesthetic brand look and feel.
- Improve visual cues and stages within the user flow.
- Provide a better design for the colorblind and follow accessibility requirements (WCAG, CVAA).
Implementation of Task Overview into the current design flow
How the task overview improves the design flow:
- A fast and easy way of understanding what stage a Hero or Looper’s task is in.
- Making it easy to navigate and manage tasks as well a create new ones.
- Provide consistent visual cues improvements throughout the entire user flow.
Design consistency throughout multiple platforms
For tasks that can become quite complex for the user, like task overview and task management, we tried making the experience as consistent as possible throughout different devices.
However, we choose to change certain screens in other areas where the bigger screen real-estate could be utilized and improve the user experience.
This page is under reconstruction, more updates coming