#19aecd

Client: Icesi University

Industry: Education

My role: User researcher, UX designer, interface design, frontend developer

Year: 2016

Icesi University has around eight administrative groups grouped within a network of offices serving a population of more than 8,000 people, including students, teachers and graduated. How to achieve deliver information for each relevant service to each profile? With a digital directory service that allows filtering content according to the user profile that requests it.

The background

To start, why?

Icesi University had a repository of about 350 links in charge of directing users to platforms or offices that provide administrative services, such as loan books, room rental, video projectors, etc. This repository was not easy to use, users took more than two minutes to find a service in their first contact and sometimes came to services that were not applicable to their profile within the university.

The challenge

Understanding business needs

Each office serves people with different interests, needs, schedules and degrees of access to information, we need to unify all this information in one place to present it in an accessible manner taking into account the profile of the user query, ensure access from different devices and allow it to be easily found in search engines even outside the university.

The research

This was the start screen; all links have a presentation in list format, the user should carefully read each link to find the service, there was a categorization of who provided the service and to whom it was directed.

You can see the entire route that a user had to do to identify the service, they had large blocks of information and multiple links that did not allow them to determine where to access.

icesi-portal-of-services-after

Gathering insights from users

I began to identify key user groups attending offices, detecting four key segments: students, teachers, workers and graduated. For each person, an archetype was developed and began to group together essential services.

Later, we made multiple sessions of co-creation with the heads of each office to find their main points of pain; I found it was not easy for them to explain that some services were virtual and others in face, plus some did not work on Saturdays or night time.

This same activity was carried out with students and staff support areas finding that it was not easy to remember the names of the services, nor identify which leadership belonged.

The discover

Findings from interviews and co-creation

All groups evaluated to identify problems found direct access to the service had difficulty reading a lot of content to meet the person in charge of providing the service, access requirements and terms of use.

For the group of students, faculty and staff were essential to find the shortcut to the platform report cases and incidents known as SGS.

Four interest groups had in common recurring services and transversal to all areas such as: reset passwords, access to institutional mail, computer rooms, etc., which suggested a set of shortcuts.

The approach

Designing experiences

Based on the findings, I decided to allow the user to choose the profile they want to navigate; even they can be combined for users with multiple profiles.

We need to create a hierarchy of information that reduces the number of clicks users, and administrative staff provides site management.

It should be an accessible platform for indexing in search engines, available from any mobile device and have a search engine that allows finding services even if they know your name.

The concept

Crafting experiences

This directory has an institutional and modern appearance, has an iconography for each office facilitating their identification, information architecture is based on the organizational chart of the university and has a search engine to find based on words related services.

Each service has a clear call to action, critical data access, a direct link to SGS and a button bar that condense the extensive information.

The design

Paper first

icesi-portal-of-services-paper-first

Wireframes v1

icesi-portal-of-services-wireframes-v1

Wireframes v2

icesi-portal-of-services-wireframes-v2

Sitemap

icesi-portal-of-services-sitemap

The development

Time to code

I developed a menu that lets you choose the profile to filter the content of the site, with the help of variables login, the browser stored the profile for future sessions to avoid having to make the selection again.

All the queries of the services to the server were done through Ajax requests, allowing reloading only a fragment of the site, consuming less data and reducing the response time.

All services were created in the backend with metatags and related keywords, to facilitate search and indexing in engines.

A breadcrumb module was developed to show the hierarchy of the navigation and to be able to easily change sections.

The deliver

Visual design

icesi-portal-of-services-header

Boom!!!

icesi-portal-of-services

icesi-portal-of-services

View project

Icesi Portal Services

The results

A new directory

The site went from 2.5k to 8k monthly visits, a real record for an institutional channel, visits from mobile devices increased 15%, the distribution is divided into 78% desktop and 22% smartphones.

The site bounce rate per month on average is 9%, and the average duration is 43 seconds validating that people quickly find information and continue to the service.

Shortcuts in the header of the site are used by 75% of visitors being able to reduce the searches within site and the changes made save on average three clicks on navigation.

All services were correctly indexed in search engines helping to external users quickly find the desired information.

The number of office visits declined for information by 15% due to the ease of finding via web and the ability to share the link service access.

Major learnings

Whenever a redesign process is somewhat slow the process of updating information, you need to start pressuring customers since the beginning of the project to deliver information, in this case, the site was ready, and three months later went live because the delay updating the information.

These institutional processes must be supported with good internal communication campaign; we ran into listless users who resist change and see no need to change the way they have operated his office for years.

This project was developed in 4 months.

The team

Sandra Paulina López, Chief Officer SYRI
Mauricio Silva, Product Owner
Ingri Lorena Jojoa, Scrum Master
David Portilla, Frontend / UX

Thanks for watching 😀

Like what you see?

I want to hear you

More work

A showcase of design, development and things that makes me happy