Unisabana App

in , , , , ,

By mid 2014, along with Jenny Robayo and a team of students, we launched the official mobile application for Universidad De La Sabana. It was a creation process that involved a Human Centered Design approach and a semester of hard work. I was the Product Designer behind it, from UX Research to UI Development, good old generalist.

Methodology: Human Center Design

Methods: Focus Groups, Interviews, Stakeholder Prioritization, Design Principles, Personas, Wireframes, Mockups & Prototypes

Tools: Adobe Illustrator, Keynote, G-Suite

Deliverables: Research Analysis, Information Architecture, Screen Designs and Assets

From left to right, Rafael Rodriguez (Integration Lead), Ricardo Sotaquira (Information Technology Engineering Director and Project's Director), Francisco Ramirez (Design Lead), Jenny Robayo (Development Lead), Juan Pablo Velasquez (Student), Alejandro Zambrano (Student). Two students missing: David Piñeros and Nicolas Guzman

Even though this project involved NDAs, the overall process began with the core team (Director and Leads) drafting the Project's Proposal and Design Concept. After an agreed Brief with the stakeholders, we conducted User Research to validate our initial hypotheses and discover new opportunities. 

The video at the left is an excerpt from the User Research activities I conducted. They were held in the first Design phase, hearing our main audience, the student community.

Out of this research we crafted Design Principles that would guide us in the App's UX and UI. We also created personas that aided the scenarios.

By overlapping Needs from users and Desires from stakeholders, and the development team's Abilities we decided which features approach first. Once having everyone on the same page, I created tentative layouts through Wireframes and Mockups, that I translated later into tap-through prototypes.

We delivered a Mobile App with a set of features with breakthrough feature to encourage students to improve their performance (virtual academic advisor) and the campus community's daily activities (news, menu, events). The advisor is a tool that will suggest what should a student aim for his next graded assignment (exams, projects, homework) according to a desired course-grade.

This is a run through the different services, natively developed in iOS and Android available for download in their corresponding links

Electronic Vote

in , , , , , , ,

In 2013 we created an electronic vote system through Android tablets that were remotely activated by a Laptop. I was the UI/UX Designer and Industrial Designer –Cubicle. Our main Design Challenge was to create an election system easily perceivable and predictable –intuitive– enough so grown-ups with no previous experience with mobile devices could vote. It was a successful system that didn't got in the way, with 93% of participation.

Storyboard

I created this storyboard so stakeholders could better understand the sought experience.

Scrutiny's visualization

For the scrutiny I developed this visualization in Processing

Interactive Table – ∏ "Planta Interactiva"—

in , , , ,

Overview

This project blends the Interactive-Tabletop framework known as Reactivsion, with an engaging way of explaining Biodiesel production. I was the Full-Stack Designer creating the UX, storyboards, 3D motion graphics and Creative Coding like animated buttons and knobs.

The objective behind this exploration is to engage potential new engineering students in an experience that helps them understand what involves any of the engineering programs offered by the faculty. Each of the 4 offered programs at Universidad de la Sabana has a specific narrative within the playful experience of creating biodiesel.

Storyboard

Tryout

Flux iPad App

in , , , , ,

Concept Development

Flux is a mobile application for tablets that introduces college students to System Dynamics. Its Design Objective involves a new visual representation to improve the user experience in System Dynamic softwares. I was the Visual and Interaction Designer behind its creation. The second iteration at the right was created with a micro-organism metaphor in mind.

For this project I worked closely with a PhD in Applied Sciences directing and implementing the mathematical models behind it, and a junior iOS Programmer.

Bertalanffy’s General Systems Theory sprung from Biology, thus a micro-organism metaphor for the final design seems convenient and captivating. Elements within the aqueous environment resemble organic-like shapes. Both features, the animated elements and organic forms contribute to Flux's aim to bridge users’ mindset onto a unified perceivable and predictable interface.

Iteration 1

Ripple effect concept were elements' behaviors interfere like waves disturbing water. 

Iteration 2

Micro-organism concept were elements have a biological look and the interface borrows visual queues from a petri-dish 

Brand Identity

In System Dynamics the concept of cycle is essential. This is why the logo's starting point is a cycle. Afterwards, a double cycle resembling the infinity symbol was used for the name's starting point.

Logo

 

Splash-screen