Case Studies

Website for the fitness industry – a place where personal brand elements are aggregated

design strony internetowej dla branży fitness

A group that strongly affects our lifestyle are representatives of the fitness industry – for example, nutricians. Along with the growing recognition of their personal brand, the range of services they offer also grows. There are dietary plans, menus, books, ebooks and many other products they can offer to their clients. The websites are becoming a kind of hub of all this and they need to manage between presenting the necessary information, selling products and services or establishing cooperations.

Client
Patrycja Rublewska - FitPatka
Goal
Creating a new website for the fitness industry
Period of cooperation
April-May 2020
Number of sprints
2
Number of people in the project
3

Project context

We started working on the Patrycja website because of a recommendation from our client – Marek Bis from the Sports Training Centre. We have worked with Marek on many occasions, and once again we had the opportunity to create something new together.

Sprint One: Kick-off workshops & solution development

 

A kick-off workshop

Our process virtually always starts with a stationary kick-off workshop. (more about our kick-off workshops can be found here). This time, we had to face a new reality due to the COVID-19 pandemic and run such a workshop remotely. During the workshop we had a chance to get to know Patrycja and her business better and together we went through the previously prepared materials to understand the context of the project more precisely.

During the workshop it is essential to identify the goals that are to be achieved. We wanted to learn about the business goal of the website for the fitness industry and expectations towards our cooperation. This allows us to better visualize the client’s business and his needs related to it. We developed the aspects of Patrycja’s business that need to be considered, divided the offered products and developed an action plan for the rest of the project.

After the workshop, we updated a document which contained information about everything we had managed to work out together, and which – to date – contained only information that had been provided to us before the launch of the project.

 

Research

The next step was to move on to the research stage. At this stage, we focused on a thorough analysis of the competition concerning the websites and the stylistics used. The main role of Patrycja’s website was to present a wide spectrum of her activities – starting with dietary consultations, preparation of various menus through own e-book products ending with a themed profile on Instagram. Patrycja wanted the website not only to support the sales of her products, but also to be a neat and transparent showcase of her personal brand. We have prepared the competition analysis in terms of twin solutions for Patrycja’s business. This gave us an overview of what the current patterns in the industry are in relation to specific services. After confronting it with Patrycja’s mode of operation and needs, we were able to start developing suitable solutions.

 

Information architecture

Due to the limited time available for developing the entire project, we have limited the information architecture to presenting the basic user flow and the content of subpages. This was supposed to be useful mostly for developers at a later stage of the project. Note that the development team participated in the project from the very beginning. It turned out to be very valuable, due to the fact that we were able to discuss the suggested solutions from the very beginning, and the developers were able to emphasize their needs even before the project started.

The information architecture was based on all the data obtained so far and on our competition analysis. An interesting aspect of its development was using a free library of elements offered by the creators of Figma (more free libraries of Figma can be found tutaj). As a result, everything we worked on could be included within one project and under one link. The client was able to observe the work progress and comment on everything within the tool at any time. 

 

UX Design

Another part of the sprint was the design of the mock-ups. We have already mentioned many times that at Project: People we do care about the user’s natural experience, which is why we try to create mock-ups so that they do not look like traditional drafts, but are more pleasing to the eye. Such techniques bring good results during the presentation of mock-ups. This allows the user to focus on their real purpose, which is the suggested construction of specific subpages.

We have prepared mock-ups showing the main elements of the website structure for the fitness industry. We did not focus on individual states or standard flow such as signing up, but only on what was important in terms of the content of subpages and their sections.

Initially, the website was supposed to be a typical one-page with the functions of an online store. However, as we worked on the project and learned more about the next aspects of Patrycja’s activity, we decided to specify two extra subpages, describing key services in detail – ready-made menus and dietary cooperation. As a result, we will be able to index the website in search engines better and describe the services offered in more detail.

Eventually, the following mock-ups were created:
– homepage
– dietary cooperation subpages
– the menus subpages
– online store subpages
– single product cards
– FAQ subpages
– contact subpages

design strony internetowej dla branży fitness

 

Moodboard

The last part of this sprint before moving on to design was to prepare a moodboard. An important aspect was to discover Patricia’s taste, the colors that are close to her and that can be associated with her brand. Our moodboard gathered projects that often differed a lot from one another. This made it possible for us to exclude directions that were wrong and direct our attention to the direction in which we really should be heading when it comes to design.

website design for the fitness industry

Sprint Two: UI Design and preparation for implementation

Once again, Figma was our main tool in the design phase. Using all the materials previously collected there – information architecture, mock-ups, moodboard – we managed to smoothly transform our work into the final design of Patrycja’s website.  

Throughout this week, we worked with Patrycja and Marek on an ongoing basis to ensure that each element we prepared meets their expectations. This was also efficient for us, as we were able to implement the feedback we received from them on an ongoing basis. We also tried to discuss the so-called “microcopy” – simple content such as CTA on buttons. The whole content was to be prepared on the basis of the sections we suggested and other elements of the website.

Get our 30+ Lean Canvas and Templates!

Sign up now:



    I agree to the processing of my personal data by Project: People Sp. z o.o. for the purpose of marketing communication in accordance with Privacy Policy

    When designing, we kept the mobile aspect in the back of our minds the whole time. Nevertheless, a large part of Patricia’s activities involve Instagram, so a major part of the traffic on the website will probably come from mobile devices. Therefore, to avoid problems after implementation, we prepared a mobile view for each subpage we designed.

    The last thing was to prepare the whole project for implementation. The file was properly formatted, the screens were arranged according to their purpose, and the whole was shared with the developers. Because of the built-in Figma option – “Code”, there was no need to share anything but a link to our project. This function allows developers to get the necessary css code based on the prepared design.

    So as to refine the whole content prepared by Marek and Patrycja, they were supported by Katarzyna Golonka from our marketing team. As a result, they managed to create a coherent and tailored content that adequately conveys all necessary information.

    Summary of our work in numbers and more

    Each website is different. Each one needs special approach regardless of whether it’s a corporate website, a website of a florist or a website of a nutrician. We treat each project individually so that we can create the best solutions possible. We make sure that our projects meet the needs of users and clients.

    The website is currently under construction and will be launched in late June. We are still in contact with Patrycja and the developers to supervise the implementation.

    10

    Hours spent on video meetings


    15

    Screens designed

    2

    Sprints of intensive cooperation

    Tools used in the project

    Figma

    Case study isn't enough?

    Would you like to learn about the whole process and how we could carry it out in your organization?

    Let's talk

    Project team, i.e. who was responsible for what

    Author of the Case Study

    Paweł Nawara Product Designer w Project: People
    Paweł is definitely a person with a can-do attitude. His typical response to the craziest ideas is to ask "How much time do I have?".

    He has been involved in the design from an early age. He has experience in various types of projects - from social media and DTP, through websites, to mobile and web applications. For the last three years, he has been most comfortable with Product Design projects.

    He is present at every stage of the process - from the initial idea and discussions with a client, through the entire design process, to working with developers on the final implementation of the product. He makes sure to always combine the perspective of a user, team, and business.

    He is actively involved in various social initiatives and the organization of events (e.g. DesignWays Conf or UEK Students Days). Supports the academic environment by helping young and development-oriented students through mentoring and training. In his free time - a keen gamer.

    Other members of the team

    Katarzyna Harmata Lean Marketing Manager & Strategist
    In business for five years, during which she managed a marketing team of over a dozen people, created cycles of business events, co-created and managed the company. Currently, she specializes in Content Marketing and Personal Branding.

    Katarzyna has been successfully combining marketing and business for years. Currently, she specializes in project management and content marketing. He has already managed a marketing team of over a dozen people, created a series of business events, co-created and managed the company.

    She helps companies find the sense of their own self in business and communicate it to the outside world (marketing & business strategy).

    She is involved in numerous social activities. She is a certified Business Coach and conducts workshops on strategy and marketing. Author of texts for industry-related portals, including Nowy Marketing, Marketing w Praktyce, E-commerce & Digital Marketing.
    Tomasz Osowski Lean UX & Service Designer w Project: People
    He helps companies create an excellent user experience while ensuring the profitability of their business. His job is to create products and services that are in demand and satisfy both the consumers and business owners.

    Certified Business Coach, Personal Development Coach, and Certified Design Thinking Moderator. Tomasz is also an entrepreneur sincerely in love with Lean methodology. He always works to get a product to market as quickly as possible with the least capital outlay.

    He has cooperated with companies such as T-mobile, Ecard, inPost, ING, Nationale Nederlanden, Brainly, Publicis, Netguru. Organizer of DesignWays Conference.