Website redesign
Novak-Rygiel

Website redesign for an architectural studio that specializes in public and industrial buildings.

Case study - Michał Sosnowski

Starting point 

The client’s website was outdated. On the other hand, many young architectural studios that appeared on the market had a more modern and trendy image. This new market competition didn’t have the experience and their portfolio was lacking, but in the perception of the customers the modern design translated into the new studios being more trustworthy. 

The client wants to show through the website that his studio is equally modern but has acompetitive advantage in the form of experience.

Business goals

Building the image of a modern and experienced architectural studio.

User's goals

Gaining information about the studio in order to compare offers and prepare recommendations for decision-makers.

User's goals

  • A person after the first business contact with my client, who wants to check the credibility and possibilities of the Novak-Rygiel architectural studio.

  • A person searching for an architectural studio for the purpose of working on a project.

  • A person already cooperating with the studio who needs to find specific information (e.g.location).

Client’s old website

Project

The project was planned based on the client's goals and budget and carried out fully by me.

Brainstorming and goals

Business goal -associations with "modern"

At this point, we decided to emphasize modernity through the minimalist design of the entire website and full-page scroll animations on the home page and the offer page.

Business goal -associations with "experience"

We decided to choose sharp corners of the elements and strong and technical font. We rejected associations such as age, maturity, oldness- because they do not fulfil the goal of building a modern image.

User Goal - Associations with "trust"

This goal includes associations regarding business goals, such as experience and professionalism. In addition, we decided to build the customer's trust by using a short form of texts written in simple and understandable language.

Information architecture

Reduction of the amount of information

I wrote out all the information and functionalities and together with the client, we decided what information to add and what we can subtract.

Information grouping

Using the information grouping method in communication with my team I assigned the content to the specific pages on the new site.

Diagrams

I prepared the information diagrams on the site, taking care of the storytelling and the path leading to the conversion. Due to the main business goal, the most important sections were those that build the image of an experienced and modern brand.

User flow

I designed user paths on the website to avoid dead ends. In the project, I took into account the situation where the starting page is a different page than the home page.

Navigation

I prepared prototypes of several website navigations, from which we chose one solution that will be useful for users and also achieve the business goal.

Additional menu

On the new website page for projects, we used an additional menu with a category selection, thanks to which the user can quickly find the information he is interested in.

Content

I have created content that will achieve both marketing goals and be useful. I made sure that the user knows exactly what the content is about.

CTA - I designed the call to action on buttons in such a way that the user knows exactly what will happen after clicking on the button.

Mockups

In the second stage of designing, I prepared low-fidelity mockups to focus on functionality and usability.

When arranging the content, I paid special attention to:

  • Grouping of information on the same subject for easy browsing

  • I used repetition of layout diagrams for the same elements

  • Building line and edge tension to facilitate browsing of the content on the page

  • I designed the axes of interaction with the CTA at the end

  • Emphasizing the client's advantage - experience

Tests

Qualitytest - A/B

I was concerned about the usability of the full-page scroll animation. For this purpose, I prepared a high fidelity mockup for the 2nd version of the main page and conducted tests on a small group of users.

Both groups were asked to find information:

  • How many customers were satisfied with the services of the Novak-Rygiel studio?

  • How many customers worked with the studio on subsequent investments?

CONTROL GROUP

This group tested the version of the page with the standard scroll action.

TEST GROUP

This group tested the version of the website with full-page scroll animation. During the test, I watched users navigating on the home page.

Questionnaire

After the test, users had to assign the score to few questions on a 5-point scale. Below are the ratings of two of them: 

Was finding the information difficult or easy?

QUESTION RESULT (AVERAGE RATINGS):

Control group: 4,2
Test group: 3,8

Is the Novak-Rygiel brand modern or outdated?

QUESTION RESULT (AVERAGE RATINGS):

Control group: 3,4
Test group: 4,6

Interpretation

A website with a full-page scroll animation makes it slightly difficult to navigate through the website, but it significantly increases the impression of modernity.

Decision

Due to the fact that building a modern image is the main goal of the client, we decided to implement the solution.

Scenarios

I prepared and tested the scenarios:

Reason for entering the website: browsing

Goal: Obtaining general information about the architecture studio, its projects, building an opinion about the company for comparison with others.

Reason for entering the website: searching

Goal: Finding specific information on the site.

I have divided this scenario into several smaller ones, in which I focused on different types of information:

  • Contact information

  • Projects

  • Offer

  • Information about the studio

High-fidelity design

I have prepared a website design with attention to elements such as:

  • Visual hierarchy

  • Gestalt principles

  • Contrast

  • Balance

  • Scale

  • Responsive design

  • Readability

  • Usability

  • Consequence - e.g. buttons always have an arrow to the right because they are text buttons. Thanks to this, the user knows that this element is clickable and will move them to another place on the website

  • Size of clickable elements on touch devices

  • Bootstrap grid system (selected framework)

Testimonials

Why I chose this project?

I chose this project because it was an intriguing experience for me. In most cases, the main purpose of a website is to sell a service or product. Here, the goal is more elusive and requires difficult design decisions. An extremely important element for me was to trust my knowledge, skills and sometimes also my intuition. But most of all, mutual trust with the client, which we have built over the years of working together.

Clients opinion

The Novak-Rygielarchitectural studio is run by Anna and Paweł Rygiel, who wrote about workingwith me:

Anna Rygiel

Owner

I have been working with Michał for over 7 years as a Novak-Rygiel company and privately. He is reliable and competent. He can read the needs of customers well on a given level of cooperation. He is always committed to what he does. In the online marketing industry (websites, social media) he is very creative, oriented to the latest trends in both technology and the possible sociological perception of planned activities in this area. In our joint activities, he was able to advise and help wisely many times. I recommend!

Paweł Rygiel

Owner

An extremely competent person, up to date with all the innovations in the field of creating websites focused on the effective acquisition of new, profiled customers. Excellent communication, understanding the real needs of the client, clear explanation of the assumptions made, timely implementation of the project - I recommend him with 100% certainty!