top of page
HeaderRipelabs.png

Ripe Labs

Redesign of Ripelabs platform - a social network for RIPE NCC to share and discuss innovative Internet-related topics

After applying for the possibility of developing this project, me alongside Paula Cepeda and Raimundo Rufin got the chance of being part of this incredible and challenging project that involved branding, graphic resources for dissemination, multiplatform web design, user experience, UX research, user testing, and platform implementation.

Brief

To create an online journal that transforms the RIPE Labs blog into a community hub.  This platform will connect people and encourage collaboration.

Outcome

A completely renewed Ripelabs platform with completely new features targeting collaboration, networking and academic discussion.

Role

UX/UI Designer

Timeline

7 Months

Team

3 Designers

mockupripelabs.jpg
Backgroundblack.png

Platform

analysis & insights

In order to understand the scope of the project and what we were working with a full usability anaylisis was implemented in the original platform.

01      Brand Identity

The platform did not have a clear brand identity, nor did it have graphic affiliation with RIPE NCC's own identity.

02      Navigation

The navigation categories were not fully defined, so there was no easy or intuitive way to navigate.

01      Interactions

The articles had few interactions. Little clarity for the article writing process and difficulty finding its different categories.

Who was our user?

Through a short enterview process with some of the current user of the platform, the user persona was quite easy to identify.

Passionate about technology

Knowledgeable about tech topics.

Software engineers and developers

were the most commons roles.

Backgroundblack.png

Rebranding

RIPE Labs is the experimental partner of the RIPE NCC, the fun one. The one who sees a puzzle in an obstacle and uses its collaborative nature to defy challenges. Powered by information sharing, innovative thinking and a fearlessness to push boundaries without being reckless. RIPE Labs is brave, inclusive and resourceful.

The hexagon being the original shape of the Ripe NCC brand has a huge impact not only in the identity but in meaning. The new branding takes the original hexagon is now embracing a smaller hexagon to showcase a comunnity where everyone is welcome to be part of, to bring techonology experts all together in one place.

Captura de pantalla 2024-11-28 a la(s) 2.53.24 a. m..png
Captura de pantalla 2024-11-28 a la(s) 2.55.58 a. m..png
Captura de pantalla 2024-11-28 a la(s) 2.56.05 a. m..png

ReBranding

El proyecto se inició con el rebranding de la subdivisión Ripe Labs de Ripe NCC, cuyo logo podemos ver a la izquierda.

Key Words:

Energetic, inclusive, spontaneous, logical, resourceful, brave.

Informal, but factual.

Pilars.png

Isotipo

img1.png

Safe Area

img2.png

Colour Versions

img3.png

Benchmark

Realizamos un benchmark analizando 3 plataformas similares y de gran renombre como lo es Medium, MIT Tech Review y Hackaday. Este análisis nos permitió determinar los requerimientos del nuevo Ripe Labs.

Site Map

Para mejorar la navegación del sitio, se determinó la arquitectura de la información. Todo un desafío considerando la cantidad de categorías ya existentes, las cuales se simplificaron y resultó en lo siguiente:

gloomap_228979af.png

Prototipo

Frame 1496.png

Con el prototipo de alta fidelidad, se determinaron los flujos más conflictivos para su posterior testeo con usuarios.

Frame 1497.png

Testeo Con Usuarios

Mediante tests de usabilidad a través de la asignación de tareas y sus consiguientes mediciones heurísticas, pudimos determinar los puntos débiles de la propuesta  e iterar en su diseño.

Frame 1498.png
UserTesting-Results.png

"I was surprised the heading of the article was not clickable. Having to find the "read the article" button was unexpected."

quote.png

"Sleek design, text readability is definitely an improvement, makes me want to read and explore. Author pictures + short bio makes me connect bit more with the article.”

quote.png
Presentation First Phase RIPE Labs 1.png
20.png
21.png
uikit.png
ripelabs.png

Análisis Plataforma

Para comenzar el proyecto y se analizó la plataforma en profundidad para entender las falencias y determinar las áreas de acción y alcance del proyecto.

pantallaanterior.png
Frame 9.png

Plataforma Inicial de Ripe Labs

bottom of page