Project from a workshop in Lean UX

Mobile App Prototype for EDIT

mockup---training
CONTEXT

This project is the result of a weekend workshop. My team and I had to worked on a app for the school where we were doing the workshop. The purpose of the workshop was working in a project implementing a lean methodology.  As time was limited, we didn’t spend that much time on the research phase (interviews with users and stakeholders), however we as students in that school were one of the target users.

 

OPPORTUNITY

To design an app for the school where people can interact with the school. EDIT is a school dedicated to the areas of Digital / Interactive Design, Creativity, Technological & Mobile Development and Digital Marketing. It’s actually where we were taking this workshop from. Nowadays the school only has a website.

The challenge involved creating an MVP to help to test our assumptions and finish the workshop with a solution. We ended up just focusing on one user flow due to the time constraint of the workshop.

 

RESEARCH

As I said before,  we kind of skipped this part of project. In a real situation we would have interviewed the stakeholders, students who are currently doing a course in the school and “potential students” who may interested in a digital training.

We were also aware that in the phase of the project we should have done a competitor analysis, but once again, we didn’t have time, we skipped this part. We worked based on our assumptions.   

This is an example of our assumption in features. What features are important?

– Calendar with all the events

– Inscription form

– Chat for contact (chat bot when the school is not open)

– Create a personal area for students that are doing or have done a course in the school:

 a)Where they have access to the bibliography and any kind of content       shared by the teacher

b) Where they can see a history of all the courses that the student has done. According to this, the school may recommend the student specific courses for the future.

 

 

PROBLEM STATEMENT & PERSONAS

The app for EDIT school  was designed to achieve an increase in the number of inscriptions, to show all the courses in the most convenient way for the user and increase the awareness of the school in the market.  We have observed that the product/service isn’t meeting: offering an easy and simple inscription process, that the website has many visits but not that many inscriptions and the school is not yet a top of mind brand for courses in this area which is causing loss in potential customers (students), thus losing money to our business. How might we improve the inscription process and courses catalogue’s presentation so that our customer are more successful based on the number of downloads of the app, the number of inscriptions made through the app, the % of contacts made through the app per month.

 

Regarding the personas, usually a UX designer would have distilled the findings from the interviews into a User Persona.  We didn’t have the chance/time to do interviews properly, however as we were all “students” from EDIT school in this workshop, we were able to create 2 personas based on our own insights and experience. Therefore, we had 2 personas:

– One persona that relates to a professional profile: someone in his 30s  that wants to gain a new skill or switch career.

– Another  persona that relates to a just graduated student profile: someone in his 20s that is looking for a specialization, he/she is a bit lost, and it’s also seeking for career advice.

 

DESIGN/ PROTOTYPING AND USABILITY TESTING

It was now time to test our assumptions.

There were many paths that we could explore but we could only take one due to compressed timeline. One of the flows we were interested in  was the “inscription flow”, because it really needed an improvement. We were also interested in working in the “personal area”.  However, we thought that it could be really interesting to “humanize” the access to the courses’ catalogue through gamification for those students that are seeking some guidance to choose the correct course.  We thought that it was a path that the other teams from the workshop would explore.

 

 

The flow we chose focused on the persona Maria wanting to find some guidance about the right course for her because she is lost and indecisive.

 

 

 

 

We produced a Low-Fi paper prototype that later on we tested with people using Pop Marvel. This was our first test. We got a very interesting feedback.

 

The feedback we had was:

–  The flow is nice, it’s light and fast

– The language used is good because it turn into a conversation

– The first screen with the question (do you know what you want: yes/no) is very confusing, it needs to have another copywriting.

– The circles don’t match the rest of the aesthetics, which is square. In addition, the visual identity of the brand uses “squares” all the time.

 

 

We analysed the feedback and changed things in our flow and wireframes to improve. From there, we went on to create the wireframes implementing some changes based on the feedback we had.

We tested the prototype before moving to the UI phase.

MOCK UP WITH VISUAL DESIGN

After discussing visual design, our intention was to keep the visual identity that is on the website, using the same fonts, colours (yellow and black as main colours) and shape (squares). Underneath there is the mockup screens from my final UI design.

I’ve prototyped in Axure RP the user flow of the training catalogue (as as sort of gamification) for those users who don’t know what to choose and need some guidance.