powrot do case studies
AV-IT Solutions

AV-IT Solutions

How we created a website combining consulting services with a comprehensive service for IT companies
That is, how we designed the persona, user journey map, and information architecture of a website for an AV/IT company.

During the first workshop with av-it.co.uk, we had a get-to-know-you meeting to present the company's needs and the expectations of the various team members. The first meeting was for pre-project preparation, and the second meeting was to discuss the materials created for the project. See how websites for the IT industry are created in our agency.

Project documentation

In the course of preparing materials for AV/IT, the project documentation was analyzed, the requirements were collected and subjected to critical analysis, the next steps in the process and the scope of work at this level were established. The results of the work are:

  1. Built personas,
  2. Designed user journey map,
  3. Prepared information architecture & discussed benchmarks

Development of personas

With regard to the main user segments, three basic personae were created, characterized by different sets of characteristics, skills and baggage of experience. The personae are representatives of the most representative groups of users, which makes it possible to assume that taking care of their needs will answer the problems of most users. The following personae have been specified:

  1. Michał Konieczny - systems administrator - technical, concrete, result-driven.
  2. Adam Poznański - Construction company owner - focused on quality, non-technical, nervous, likes to feel valued and relies on customer service contact.
  3. Urszula Gwint - officer manager in a corporation - non-technical with no time for further education on the subject, wants to shine in front of the bosses and counts on support.

User journey map

User Journey Map is a technique for tracking the feelings, motivations, actions and effects of a process from the perspective of personas and thus ordinary users. Empartization at every step of the user path maximizes the positive experience of using the site and prevents errors from occurring. For the project, the focus was on aspects such as:

  1. Motivation
  2. Concerns
  3. Opportunity
  4. Selection
  5. Confirmation of selection

Information architecture of the website

The website architecture is divided into pages and individual sections. Each section corresponds to the particular needs of the personas. The main sub-pages are:

  1. Homepage
  2. Products
  3. Product page
  4. Realizations
  5. Realization Page
  6. Industries
  7. Industry page
  8. Contact


The home page is the business card of any website, the place where the user goes and forms an opinion about the company, products which ultimately influences his decisions. The homepage should clearly present what the company does, its values and why it is worth trusting. The site should not be too long and overloaded with information because this can lead to discouragement of users.

The first element looking from the top on the home page is the introduction block. Above it you can put a quick contact to the company's representatives.

Appearance of the Section:

  • Looped video (looks better but may slow down the site on older computers)
  • Photo with text (looks good and works well on any computer)
  • Behavioral background relating to the industry/job
  • Dealer contacts
  • Concise copy

Another section is Reason to believe - an element that increases the credibility of the site and shows that the company works with a variety of valuable customers.

Section appearance:

  • Customer icons placed on the bar
  • Icons should be not too large to fit 5-7 in a row
  • Often the icons are black and white but this is firmly an aesthetic issue

Product and service sections should be located on the home page. You should identify the main products and services that direct from the home page to the product and service subpages. The blocks are arranged in rows of 5/7.

Section appearance:

  • First row - product blocks
  • Second row - service
  • Appearance of the block: products/services photo, title, elements

A section introducing partners, i.e. companies that provide equipment.

Section appearance:

  • A row of icons
  • Icons similar to those used in the reason to belive section

Section in which the most important realizations will be presented in blocks. Section analogous to the previous ones, i.e. 5-7 clickable blocks in a row. The blocks should have a large photo and caption, are clickable and lead to individual realizations.

Section appearance:

  • Row of blocks at 5/7 per row
  • Appearance of the block: photo, name, company for which the order was executed

Section in which the most important industries will be presented in blocks. A row of blocks of 5-7, can be icons important that like the rest of the site they are clickable.

Section appearance:

  • Row of blocks
  • Appearance of the industry block: icons, name, short description

The footer is the key section for all pages and should present the most important data and categories. Based on experience, sites/sites of this size tend to have minimalist footers and I suggest this as well. In the future, I suggest implementing a newsletter.

Section elements:

  • Contact information
  • Contact numbers
  • Company details

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Nie masz czasu przeczytać ?

Scope of work

IT company needs analysis
construction of personas
development of website architecture
implementation and coding of the website
SEO and technical optimization