Lesson learned about building new startup project

Lesson learned about building new startup project

Where

Poland

Scope

Web, App, UX/UI, Analytics

Type

Commercial

Commercial

Role

Product Designer

When

March 2024

March 2024

Category

Gym & Trainers

Project overview

General idea

General idea

I joined zTrener startup when they already had begun work on their product. They were in need of someone to take charge of the whole design area. It was a small team of <10 people. I was actively working with the team to build it from 0 to 1.

What was I doing there?

My responsibility was to create a website/app and come up with solutions to the problems they had. I focused on making it simple and easy to use. After the MVP, I began analyzing the website through Hotjar and listening to users' feedback to further improve the product

Create a place where users can search for their personal trainers and schedule a meeting with them. Primary goal was to create MVP version and start gathering clients and trainers.

What’s the point? Our why?

Create a place where users can search for their personal trainers and schedule a meeting with them. The primary objective was to build an MVP version to begin attracting clients and trainers.

Create a place where users can search for their personal trainers and schedule a meeting with them. Primary goal was to create MVP version and start gathering clients and trainers.

Challenges that

I faced

Every project comes with its unique set of challenges, pushing me to think creatively and adapt. I've encountered a variety of challenges that tested my skills and resilience.

01

Starting out

Right after I joined, I ran a design

review of the first mockup pages they had and began discussing what should be done next.

02

Combining everyone’s needs

I aligned business, design, and user needs with stakeholder expectations. Frequent iterations were necessary to meet all expectations

03

Proper communication

Being an open-minded person helped me here. I actively listened

to and processed all the feedback received and had to justify the rationale behind my design choices.

04

Quality assurance

Another challenge I faced was to ensure that developers implemented my design diligently. I tried to maintain quality assurance and address any mistakes that I found.

Quickly how I do it

  1. What am I working on?

I focus on understanding what I’ll be working on:

  • Why?

  • For who?

  • What’s the goal?

  • Gathering all additional important info

  1. Looking for inspiration

  • I browse the net around for similar projects

  • I look for potential competition and try to find out what they’re doing good/bad

  • Creating a mood board to inspire myself with

  1. Early design & Iterations

  • I use Notion to type down necessary information and elements

  • Next, I put required elements and iterate on different layout options

  • Slowly adding typography and some color, testing what fits

  1. Winner of design battle

  • I usually create 2-4 versions depending what I’m working on

  • Next, I choose the best looking one alongside seeking feedback

  • After feedback I work towards polishing the final mockups

  1. Helping out Devs

  • After I’m done with designing, I hand it over to developers

  • I help them out and prepare style guide, export/compress icons and photos

  • I stay in touch whether they have any questions related to design or problems to solve

  1. After care & Analysing

  • After the project went LIVE, I set up Hotjar to gather info on how users go through our website

  • Following the information I gathered I solved any problems that I spotted

  • We have been working on resolving any problems reported by users.

Layout grid, Alignment, Spacing and Contrast

I was trying a different approach with a smaller layout grid size and my favorite, most-used 8pt grid system.

Contact form has been adjusted where I:

  • Removed extra unnecessary field

  • Added information processing clause that is required by law

Color palette

Primary

#3A4351

Component BG

#C6C6C6

Off-White

#F2F2F2

Dark

#3A4351

Medium Grey

#C6C6C6

Light Grey

#F2F2F2

Typography

  • I pay attention to text/paragraph formating to not let it become cluster of text and increase readability

Wrong

Agnieszka S.

Dzięki wsparciu i fachowej wiedzy trenerów, nie tylko poprawiłam swoją kondycję, ale również zyskałam pewność siebie. Elastyczne plany treningowe i przyjazna atmosfera. Polecam!

Correct

Agnieszka S.

Dzięki wsparciu i fachowej wiedzy trenerów, nie tylko poprawiłam swoją kondycję, ale również zyskałam pewność siebie. Elastyczne plany treningowe i przyjazna atmosfera. Polecam!

  • Font they chose before i jumped into designing was Rubik and I didn’t have anything against it.

Aa

Rubik

Medium

Aa

Rubik

Bold

Inside the project: Component examples

You learn while you keep going #Comparison

The initial version of visit reservation wasn’t the best so I was looking to make it better:


  • I added clear information with which trainer they’re making reservation with

  • It was a must to add a checkbox with accepting rules or data processing according to EU law

Before

After

After going through Hotjar recordings. I found out that some users tried to click on copyrights:

  • To remove an unnecessary action, I decided to place the copyright below the logo so it wouldn’t be close to actual links, as it’s not one (Proximity Law)

Before

After

During one of the meetings, the feedback I received was to try to increase the number of users who fill out information about their profile

  • Right after logging in I created a pop up window to inform users that their profile is invisible until they provide necessary information

  • Next to profile icon I placed an icon which would trigger said pop up as well.

Design/Dev ping-pong

Frontend Developer I was working with was really helpful and insightful in identifying potential issues and problems that needed to be fixed. As soon as he reported any issues, I began working to resolve them.


I loved collaborating at the intersection of design and development. It was a great experience to learn more about their needs and how I could make things easier for them

Kamil Dryzek

Frontend Developer

Artur joined the team during the course of the project and immediately fit in. He created a modern, clear, and intuitive interface for the web application. Despite the time pressure, he designed a cohesive and modern version of the mobile app in a short period of time.


He is open to feedback and can adjust designs to meet project requirements. I highly recommend working with Artur.

Collaboration & Presentations

To keep in touch with everyone and stay updated on work progress, we had two meetings each week on Google Meet. It was time to brainstorm ideas, raise concerns or voice any problems. I was working more on the WHY? Which led me to explain my design decisions better to everyone.

Full home page view

Thoughts at the end

Importance of growth

I had joined zTrener when the work has already begun and they needed me to continue their work and develop it further. I learned quite a lot and my mindset broadened about making design go along with business. Receiving feedback from my peers pushed me even further.

People were initially interested in using such product BUT

We learned that there wasn't enough initial research about the end goal, which meant to be successful, we'd need to invest a lot of funds into gathering a good base of trainers, and clients. We found this wasn't a goal worth pursuing further, whereas initial talks with coaches and gym goers had shown interest in usuing such a product.

Thank you for checking out my case study. I encourage you to contact me. Hope you’ll have a good day! ☀ ️

Message me at @

Connect with me at

Copyright

© 2023 Artur Niedzielski. All rights reserved.

Built with Framer.

© 2023 Artur Niedzielski. All rights reserved.

Built with Framer.

Type

Commercial

Scope

Web, App, UX/UI,

Analytics

Where

Poland

Category

Gym & Trainers

Role

Product Designer

When

March 2024

Project overview

What’s the point? Our why?

Create a place where users can search for their personal trainers and schedule a meeting with them. The primary objective was to build an MVP version to begin attracting clients and trainers.

What was I doing there?

My responsibility was to create a website/app and come up with solutions to the problems they had. I focused on making it simple and easy to use. After the MVP, I began analyzing the website through Hotjar and listening to users' feedback to further improve the product

General idea

I joined zTrener startup when they already had begun work on their product. They were in need of someone to take charge of the whole design area. It was a small team of <10 people. I was actively working with the team to build it from 0 to 1.

Challenges that I faced

Every project comes with its unique set of challenges, pushing me to think creatively and adapt. I've encountered a variety of challenges that tested my skills and resilience.

01

Starting out

Right after I joined I ran a design

review of first mockup pages they had and began discussing what should be done next.

02

Combining everyone’s needs

I aligned business, design, and user needs with stakeholder expectations. Frequent iterations were necessary to meet all expectations

03

Proper communication

Being an openminded person helped me here. I had to listen and understand any feedback I received and explain my design choices.

04

Quality assurance

Another challenge I faced was to make sure devs implemented my design diligently. I tried to keep quality assurance and task any mistakes.

Quickly how I do it

  1. What am I working on?

I focus on understanding what I’ll be working on:

  • Why?

  • For who?

  • What’s the goal?

  • Gathering all additional important info

  1. Looking for inspiration

  • I browse the net around for similar projects

  • I look for potential competition and try to find out what they’re doing good/bad

  • Creating a mood board to inspire myself with

  1. Early design & Iterations

  • I use Notion to type down necessary information and elements

  • Next, I put required elements and iterate on different layout options

  • Slowly adding trypography and some color, testing what fits

  1. Winner of design battle

  • I usually create 2-4 versions depending what I’m working on

  • Next, I choose the best looking one alongside seeking feedback

  • After feedback I work towards polishing the final mockups

  1. Helping out Devs

  • After I’m done with designing, I hand it over to devs

  • I help them out and prepare style guide, export/compress icons and photos

  • I stay in touch whether they have any questions related to design or problems to solve

  1. After care & Analysing

  • After project went LIVE I set up Hotjar to gather info on how users go through our website

  • Following the information I gathered I was solving any problems that I spotted

  • We have been working on resolving any problems reported by users

All about color

Primary

#3A4351

Component BG

#C6C6C6

Off-White

#F2F2F2

Dark

#3A4351

Medium Grey

#C6C6C6

Light Grey

#F2F2F2

Layout grid, Alignment, Spacing and Contrast

I was trying a different approach with a smaller layout grid size and my favorite, most-used 8pt grid system.

Contact form has been adjusted where I:

  • Removed extra unnecessary field

  • Added information processing clause that is required by law

Inside the project: Component examples

Typography choice

  • I pay attention to text/paragraph formating to not let it become cluster of text and increase readability

Correct

Agnieszka S.

Dzięki wsparciu i fachowej wiedzy trenerów, nie tylko poprawiłam swoją kondycję, ale również zyskałam pewność siebie. Elastyczne plany treningowe i przyjazna atmosfera. Polecam!

Wrong

Agnieszka S.

Dzięki wsparciu i fachowej wiedzy trenerów, nie tylko poprawiłam swoją kondycję, ale również zyskałam pewność siebie. Elastyczne plany treningowe i przyjazna atmosfera. Polecam!

  • Font they chose before i jumped into designing was Rubik and I didn’t have anything against it

Aa

Rubik

Medium

Aa

Rubik

Bold

You learn while you keep going #Comparison

The initial version of visit reservation wasn’t the best so I was looking to make it better:


  • I added clear information with which trainer they’re making reservation with.

  • It was a must to add a checkbox with accepting rules or data processing according to EU law

Before

After

After going through Hotjar recordings. I found out that some users tried to click on copyrights:

  • To remove an unnecessary action, I decided to place the copyright below the logo so it wouldn’t be close to actual links, as it’s not one (Proximity Law)

Before

After

During one of the meetings, the feedback I received was to try to increase the number of users who fill out information about their profile

  • Right after logging in I created a pop up window to inform users that their profile is invisible until they provide necessary information

  • Next to profile icon I placed an icon which would trigger said pop up as well.

Full home page view

I advise to check it on desktop screen.

Design/Dev ping-pong

Frontend Developer I was working with was really helpful and insightful in identifying potential issues and problems that needed to be fixed. As soon as he reported any issues, I began working to resolve them.


I loved collaborating at the intersection of design and development. It was a great experience to learn more about their needs and how I could make things easier for them

Collaboration & Presentations

To keep in touch with everyone and stay updated on work progress, we had two meetings each week on Google Meet. It was time to brainstorm ideas, raise concerns or voice any problems.

I was working more on the WHY? Which led me to explain my design decisions better to everyone.

Kamil Dryzek

Frontend Developer

Artur joined the team during the course of the project and immediately fit in. He created a modern, clear, and intuitive interface for the web application. Despite the time pressure, he designed a cohesive and modern version of the mobile app in a short period of time.

He is open to feedback and can adjust designs to meet project requirements. I highly recommend working with Artur.

Thank you for checking out my case study. I encourage you to contact me. Hope you’ll have a good day!

Thoughts at the end

Importance of growth

I had joined zTrener when the work has already begun and they needed me to continue their work and develop it further. I learned quite a lot and my mindset broadened about making design go along with business. Receiving feedback from my peers pushed me even further.

People were initially interested in using such product BUT

We learned that there wasn't enough initial research about the end goal, which meant to be successful, we'd need to invest a lot of funds into gathering a good base of trainers, and clients. We found this wasn't a goal worth pursuing further, whereas initial talks with coaches and gym goers had shown interest in usuing such a product.

Copyright

© 2023 Artur Niedzielski. All rights reserved. Built with Framer.