Kortext

Redesign Kortext's marketing site and promote the Kortext Reader App

Year

2019

Team

Kortext

Project Type

Product design, Identity

Role

UI & UX Designer, Illustrator

Project Overview

Designing an effective study tool

Kortext provides an online learning platform with access to over 2m digital textbooks and other learning content to universities.

Challenge

Users weren’t able to understand the purpose of the product and what Kortext does for students, librarians, educators and publishers. Aesthetically it was a visual dumping ground that didn’t do justice to the brand purpose. The website already had all the content but a little too much of it. It amplified confusion rather than coherency.

My Role/Responsibilities

Art Direction
Identity, web design
Illustration
UX Design support

Research & Planning

Competitor Analysis

We analysed direct competitors in conjunction with indirect competitors in order to understand the overall user experience these websites provide.

There were several areas of improvement that could be made to the design and functionality of a marketing website.

Creating User Personas

Personas were created by conducting user research and identifying common pain points, which are UX issues that frustrate and inhibit the user from getting what they need from a product

Discovery – Review Current Website

The previous version of their website was dated, slow, and uninteresting. Kortext needed a website that was easy to use, easy to update, and fast. It also needed to convey their confidence and dedication to their clients.

Affinity Mapping

It took us a few workshops with key stakeholders (the business) to understand company vision, overall goals and challenges. It helped us to compile comparative user journeys and scenario maps.

Visual Design and UX Goals
○ Incorporate illustrations into UI design.

Initial wire-framing happened with illustrations in mind.

○ Get rid of all the cluttered information and support the copy and articles with visuals.

In order to get a user to engage with the content, it is crucial to take their attention and get their interest first. After getting the team’s feedback I initially made the illustrations and we selected the right ones in our workshops to accomplish that initial step. 

○ Carefully apply minimalist principles to make the website attractive and effective.
○ Keep the design fun and minimal with simple user interactions.

Illustrations can also serve as visual markers for categories of the content or rubrics of the copy. These visuals helped us with the messaging. 

○ Explain with illustrations

Most people perceive images faster than words and pictures work as a more universal tool of communication than text. Kortext’s user base has become increasingly international over the years and we always need to design according to the target audience’s expectations. A powerful visual concept is what drives the user experience. 

Brand Identity

Visual Consistency

Before I joined the project, Kortext had already undergone a rebranding.

Both digital and physical communication with the users was considered in the product's branding and promotion strategy. The visual consistency is achieved with several key elements: a logo, colours, illustrations, and typography.

Logo

Kortext wanted their logo colour and brand identity to reflect a platform that ‘makes you study smarter’ and promotes ambition and success; confidence and pride; passion and energy.

Another important aspect was the high readability of the logo since it would be used on various platforms, devices and quite often on the go, so it had to be readable at the same time.

Typography

Open Sans was chosen for its friendly appearance. The font's letterforms are highly readable and it's optimised for print, web, and mobile. This was one of the reasons Kortext chose it for its branding.

Color Palette

Kortext's updated palette is based on the company's previous colour scheme, with purple hues adapted to create a more friendly and playful look.

Kortext app

The app's revised interface is simple and intuitive. Due to its airy look and limited colour palette, it allows visitors to easily connect to the brand, avoid distraction, and scan the web pages due to contrast colours and readable fonts.

Instagram Grid & Social Media

Based on the Marketing team's content calendar, I created this grid for Kortext's Instagram page. With my illustrations, we communicated more effectively and promoted the product.

Final Design

Making a study tool that's meaningful and relevant

With a focus on user experience and design, we created an engaging website, a striking brand identity accompanied by illustrations, and an app that helps students study efficiently.

More Case Studies