Celtic

Celtic Solutions is a company dedicated to the development of technological products and offers comprehensive software services to its clients.

We need to update the company's corporate website, both in terms of content and visual aspects, to better suit the communication needs of the company and to make the content more accessible for users.

CLIENT Celtic
DATE 2022
TASKS User research | UX/UI | Layout | Front-end

The challenge.

Recognizing the users' motivations when navigating on the website
Updating the visual interface to enhance the user experience.
Establishing a new content hierarchy
Balancing corporate information with programming-related content
New visual interface and new iconography

Our goal is to offer a better user experience, while maintaining a balance between corporate & comercial information and programming-related content.

The solution.

Design System

The web's dominant colors are inherited from the logo and style guide, with blue and water green predominating. Dark backgrounds and contrast with the text give the design a technological and modern look.

The typography choice aims for modernity and technological appearance. Headers and highlights are created using the Fjalla One font; the body of text is created using Work Sans for its legibility and consistency.

We choose a vibrant blue color that contrasts with the backgrounds for the "calls-to-action".

The use of cards and other components will be essential to organize and prioritize the content of the different seminars.

User definition

We have to differentiate 2 main types of users:

The clients: users who intend to contract the different services offered by the company. This type of users refers to the staff of national and international companies and enterprises interested in developing some software application.

The professionals: users who access the web platform in search of content and seminars, mostly young programmers, students, engineers and all kind of professionals related to the programming area.

Visual interface - UX/UI

Homepage

We highlight the logo and navigation, simple and accessible, within the Header.

In the "hero" section we show an introduction text, while we place a cta to contact the company. At the bottom of this section, we find a slider with different cards for the featured seminars.

In the content area we have 4 blocks: a first block as an introduction to the company; a second block as a presentation of the seminars; a third block with the latest executed projects; finally, a fourth block with the job positions currently available.

In the footer action we provide all the company information besides a contact form.

Seminars

It is important to organize the information in an accessible way for the user. In order to get this, we use cards that allow us to separate the information clearly. Each card shows the relevant information of the seminar in a hierarchical way: title, author, content area and a brief introduction to the content.

Portfolio

The portfolio page displays the latest featured projects with a project title, a brief description, and the technologies used to develop them; each project is displayed as a horizontal slider with images of the key visual elements.