(2021)

Alacris — Design studio website

About the project

01

Alacris is a design studio that designs websites, apps and brands identity. They needed a landing page that would present their company to clients.

The main purpose of this banding is to attract and build the trust of new customers. As a rule, the flow of new users is either through search engines or through direct sending a link to a potential client.

Design process in this project

Working process

02

For this project, the workflow was a little tighter, since Alacris came to me with a tested hypothesis and detailed information about the target audience.

I was mainly involved in building the concept and working on a visually appealing but functional website. As always, I prepared low and high fidelity wireframes with different structure and composition before creating the design. At the design stage I worked on the UI kit and the landing page itself, and after that I prepared comments and held several meetings with the development team, where I explained all the rules of building the design.

Alacris provided me with all the documentation about their studio, which made my job a lot easier and faster.

Design process of this project

Custom graphic elements

03

We had the idea to create a unique visual component of the banding, so it differed from thousands of other sites.

We settled on the idea of using custom sketch-style graphics, where all the elements look like they were drawn carelessly by hand. I drew about 20 of these drawings and here are the ones we used on the site.

Custom graphic elements

Desktop design

04

The design was made in a pretty bright color scheme on a white background to convey a mood of friendliness and openness.

The main emphasis is placed on large headlines and graphic elements in order to reduce the cognitive load of the user and bring to him only the most important information. Custom graphic elements highlight and streamline text blocks, thereby shifting the focus to them.

Since the key action is to collect user data, I designed a fixed large button at the bottom of the screen for quick contact

Landing page desktop design

Desktop grid

Responsive versions

05

In order for the site to look perfect on all devices, I created design versions for huge desktops, small desktops, tablets and mobile.

I also wrote documentation on how all elements should behave at different screen sizes to ensure that the perception of the site remains the same on all platforms. I used a detailed grid that changes depending on the device for ease of responsiveness. This way any new section can be built according to all the rules of responsiveness within a few minutes.

Mobile design

Tablet design

(2021)

Alacris —
Design studio website

About the project

01

Alacris is a design studio that designs websites, apps and brands identity. They needed a landing page that would present their company to clients.

The main purpose of this banding is to attract and build the trust of new customers. As a rule, the flow of new users is either through search engines or through direct sending a link to a potential client.

Design process in this project

Working process

02

For this project, the workflow was a little tighter, since Alacris came to me with a tested hypothesis and detailed information about the target audience.

I was mainly involved in building the concept and working on a visually appealing but functional website. As always, I prepared low and high fidelity wireframes with different structure and composition before creating the design. At the design stage I worked on the UI kit and the landing page itself, and after that I prepared comments and held several meetings with the development team, where I explained all the rules of building the design.

Design process of this project

This landing page was created to understand how many people will be ready to use the product on the release

Custom graphic elements

03

We had the idea to create a unique visual component of the banding, so it differed from thousands of other sites.

We settled on the idea of using custom sketch-style graphics, where all the elements look like they were drawn carelessly by hand. I drew about 20 of these drawings and here are the ones we used on the site.

Custom graphic elements

Desktop design

04

The design was made in a pretty bright color scheme on a white background to convey a mood of friendliness and openness.

The main emphasis is placed on large headlines and graphic elements in order to reduce the cognitive load of the user and bring to him only the most important information. Custom graphic elements highlight and streamline text blocks, thereby shifting the focus to them.

In this case study, we'll only look at the manager and stakeholder version, because it shows all functional.

Desktop grid

Landing page desktop design

Responsive versions

05

In order for the site to look perfect on all devices, I created design versions for huge desktops, small desktops, tablets and mobile.

I also wrote documentation on how all elements should behave at different screen sizes to ensure that the perception of the site remains the same on all platforms. I used a detailed grid that changes depending on the device for ease of responsiveness. This way any new section can be built according to all the rules of responsiveness within a few minutes.

Tablet design

Mobile design

(2022)

Alacris — Design studio website

About the project

01

Alacris is a design studio that designs websites, apps and brands identity. They needed a landing page that would present their company to clients.

The main purpose of this banding is to attract and build the trust of new customers. As a rule, the flow of new users is either through search engines or through direct sending a link to a potential client.

User flow

Working process

02

For this project, the workflow was a little tighter, since Alacris came to me with a tested hypothesis and detailed information about the target audience.

I was mainly involved in building the concept and working on a visually appealing but functional website. As always, I prepared low and high fidelity wireframes with different structure and composition before creating the design. At the design stage I worked on the UI kit and the landing page itself, and after that I prepared comments and held several meetings with the development team, where I explained all the rules of building the design.

This landing page was created to understand how many people will be ready to use the product on the release

Design process of this project

Custom graphic elements

03

We had the idea to create a unique visual component of the banding, so it differed from thousands of other sites.

We settled on the idea of using custom sketch-style graphics, where all the elements look like they were drawn carelessly by hand. I drew about 20 of these drawings and here are the ones we used on the site.

Custom graphic elements

Desktop design

04

The design was made in a pretty bright color scheme on a white background to convey a mood of friendliness and openness.

The main emphasis is placed on large headlines and graphic elements in order to reduce the cognitive load of the user and bring to him only the most important information. Custom graphic elements highlight and streamline text blocks, thereby shifting the focus to them.

In this case study, we'll only look at the manager and stakeholder version, because it shows all functional.

Desktop grid

Landing page desktop design

Responsive versions

05

In order for the site to look perfect on all devices, I created design versions for huge desktops, small desktops, tablets and mobile.

I also wrote documentation on how all elements should behave at different screen sizes to ensure that the perception of the site remains the same on all platforms. I used a detailed grid that changes depending on the device for ease of responsiveness. This way any new section can be built according to all the rules of responsiveness within a few minutes.

Mobile design

Tablet design

(2022-2023)

Alacris — Design studio website

About the project

01

Alacris is a design studio that designs websites, apps and brands identity. They needed a landing page that would present their company to clients.

The main purpose of this banding is to attract and build the trust of new customers. As a rule, the flow of new users is either through search engines or through direct sending a link to a potential client.

User flow

Working process

02

For this project, the workflow was a little tighter, since Alacris came to me with a tested hypothesis and detailed information about the target audience.

I was mainly involved in building the concept and working on a visually appealing but functional website. As always, I prepared low and high fidelity wireframes with different structure and composition before creating the design. At the design stage I worked on the UI kit and the landing page itself, and after that I prepared comments and held several meetings with the development team, where I explained all the rules of building the design.

This landing page was created to understand how many people will be ready to use the product on the release

Design process of this project

Custom graphic elements

03

We had the idea to create a unique visual component of the banding, so it differed from thousands of other sites.

We settled on the idea of using custom sketch-style graphics, where all the elements look like they were drawn carelessly by hand. I drew about 20 of these drawings and here are the ones we used on the site.

Custom graphic elements

Desktop design

04

The design was made in a pretty bright color scheme on a white background to convey a mood of friendliness and openness.

The main emphasis is placed on large headlines and graphic elements in order to reduce the cognitive load of the user and bring to him only the most important information. Custom graphic elements highlight and streamline text blocks, thereby shifting the focus to them.

Desktop grid

Landing page desktop design

In this case study, we'll only look at the manager and stakeholder version, because it shows all functional.

05

Responsive versions

In order for the site to look perfect on all devices, I created design versions for huge desktops, small desktops, tablets and mobile.

I also wrote documentation on how all elements should behave at different screen sizes to ensure that the perception of the site remains the same on all platforms. I used a detailed grid that changes depending on the device for ease of responsiveness. This way any new section can be built according to all the rules of responsiveness within a few minutes.

Mobile design

Tablet design