Living up to your digital ambitions, that's what we're all about at PHPro! To make this happen, we have developed a plan to digital success: our PHPro roadmap. The third phase of our project approach: UX & Design.

Based on the elaborated digital strategy, we design an optimal user experience for your visitors. The design process consists of the following phases:

1. Information Architecture
2. Wireframes
3. Styleguide
4. Visual design.

We discuss each phase separately. 

A website consists of several pages and a lot of content. It is easy to get lost in a maze of links and pages.

In a high level content analysis we identify the content needs of the various target groups and review the current content. We provide recommendations around the digital communication strategy and SEO requirements.

The content analysis helps determine which pages should be included in the new website or webshop. The information architecture makes the relationships between these different web pages and the content clear by means of a diagram. This technique is a rather technical approach, without looking at the user and his goal.

The task of information architecture is to show that different pages can communicate with each other and how the content can be organized.

Wireframes are a visual aidwhen developing a website or application. Compare them to construction drawing, which provides an overview of the various components that must be present.

The goal: to draw out the structure and map out the different interface elements.

It translates the analysis into a more visual and understandable concept. A good wireframe ensures that everyone is aligned, even before the real development starts. It focuses on correct and complete content and functionality.

The wireframes are included in the analysis document which is developed in parallel with the wireframing. The analysis document ensures that all unique screen elements are explained. A wireframe by itself is usually not enough, the analysis document clarifies what actions and logic are behind the different elements.

Corporate identity

A corporate identity is a combination of visual elements that convey a certain atmosphere, in accordance with the vision and mission of the company. These elements must be unique and recognizable. In order to maintain uniformity across the various channels, these items are elaborated in a corporate identity guide.

Styleguide

A styleguide is a collection of all user interface elements that have been addressed in the visual design. The design and behaviors of the elements are described in this guide. This allows us to know what properties each object has. It is a very useful tool for frontend developments.

The visual design of the user interface is the bridge between the system and the end user. The structure and content is already defined. In this phase the wireframes are graphically worked out. 

We can work from an existing corporate identity, a theme or a new look and feel to determine the atmosphere. The many user-interface elements are processed into a total concept, consisting of several pages. A page combines different elements, such as buttons, images, text and menus, tables, ... and this according to the predefined house style.

At PHPRo there are three options.

1. Quick option: Here PHPro bases itself on the current website design. In this case no wireframes will be developed, because the structure of the website is taken over.
2. Theme option: Here we base ourselves on the design and wireframes of the standard Magento theme. Of course, your branding will be applied to this design. This means that the colors, fonts, logos, icons and general look & feel will be adapted to your corporate identity. Structural changes, where user interface elements are moved or features are added are not included.
3. Custom design: In this option we choose to create a custom design concept for the website, taking into account the developed wireframes and the input from the previous workshops.