top of page

Miaudota NGO

Design Sprint

Briefing

This project was an online design sprint created by the Design Team channel with the mentorship of Rodrigo Lemes and the participation of other great designers.

​

We had to help solve a problem for the NGO Miaudota (analogy of "miau" and "me adota", that means adopt me) during a 5-day design sprint. Each day there was a live talk with different professionals to help guide us through.

​

For this project, I made a duo with my friend Cristiano Flores, that has a background in IT and is also a UX student.

​

Our project was fully done collaborating on Figma, using it as a mural and a design app.

Day 1 - Mapping

On the first day, we started studying a bit about design sprint, the double diamond, and how we could approach the case. Then we organized our daily tasks, that were:

​

  • Day1 - Mapping

  • Day2 - Sketching

  • Day3 - Deciding

  • Day4 - Prototyping

  • Day5 - Validating

Mural.png
image 2.png
image 1.png
image 3.png
persona 1.png
CSD.png
jornada de usuario 1.png

We also used day 1 to organize an online survey to try and get some insights on possible users and make a persona. The objective was to try and extract some information the see if our possible users would give Anita the problems that she mentioned.

​

Meanwhile, we made what we call a CSD matrix (Certainties, Assumptions, and Doubts), analyzed and discussed the problems that Anita had.

​

With the survey complete, we made a persona followed by a user journey that lead us, on day 2, to define what problems should be attacked and which ones could be less harmful.

Day 2 - Sketching

Day 2, as said before, started out by defining what problem we should and could attack.

 

She had mentioned that she was clumsy with social media and digital art, so she wasted a lot of time to try and make a good image for the NPO.

​

Amongst other problems like financials and adoption, we decided that her time was important, so if we could help her not having to waste so much time on social media, she would have time to solve the other problems.

​

*They are so cute... I want one*

Rectangle 8.png
Group 43.png
crazy 8 miaudota 1.png

After defining the problem, we started to sketch our ideas. We used a method called "crazy 8" were we each had to generate 8 ideas in 16 minutes (2 minutes per idea).

Day 3- Deciding
Frame 8.png

To help define which ideas were best, we created a graph with Y-axis as the "user value" and X-axis as "less technical difficulty"

​

We analyzed each idea and positioned them on the graph. The ones further to the upper right side would be the best ones, and the ones closer to the bottom left the worst.

​

Since we had some similar ideas, a few of them ended up together and our solution became clear: we would make a web app.

The app would be simple and fast so that she, with a few clicks, would have her kitty's photos ready for show.

​

A few of the functions would be: pre-made frames, different types, pre-made tags, text, and some adjustment filters.

​

There would also be a mobile version, where Anita could quickly take pictures on her phone, edit right away, and post it on her social media.

​

​

Day 4- Prototyping

Sketching is how we started our 4th day of the design sprint. Each of us had 10 minutes to draw wireframes of what we thought our web app would be.

​

My idea was to create a web and a mobile version with just a menu tab and quick post links and a big focus on the visualization of the art.

image 7.png
image 6.png
image 5.png
image 4.png
Flow.png

Roboto 18 (desktop)

Roboto 11 (mobile)

The simplified user flow would be something like this

We quickly chose our font as Roboto, got some material design icons (but also made a couple), defined our primary colors using the logo's brown as the main and a much lighter shade as the secondary, and started designing.

We thought the design was very simple, intuitive, and pleased us:

​

A simple menu with all the design tools that would open a tab with her options.

​

Once chosen, they would already have a pre-defined place to pop up but could be moved by her if needed.

​

A "do" and a "redo" button.

​

Her social media accounts linked and her website ready for a post.

​

PWA.png
Edit Screen.png

The same goes for the mobile version, with the exception of the "new photo" button, to instantly take a photo instead of choosing a previous one.

Day 5- Validating

Finally, the last day was here for user testing and validation (or invalidation).

​

We first made a script of how to engage the user, telling him all the information that he needs and getting his consent. Then we set up the tasks that needed to be done on both the mobile and the web app, using the prototype created based on the basic user flow.

​

​

Frame 10.png

Sorry, no photos of mom. =/

We didn't have experience with remote user testing and had little time to try out some tools so, due to the pandemic, we chose someone we could easily access and had little knowledge of how to use a computer: my mother.

​

After she agreed, I sat her down on my chair, shared my screen with Cristiano, and opened the microphone for communication. We explained to her everything she needed and, while I was next to her as a facilitator and paying more attention to her, Cristiano was taking the notes and focusing on the screen.

Validation Insights

​

Our main insights on the mobile app were:

  • slight difficulty to recognize the hamburger menu

  • clicked on the camera (new photo) instead of the photo menu button first

  • we didn't explain well wich photo she had to choose

  • we also didn't explain well the text

  • with a few setbacks, she still could do the task pretty fast

​

Web App insights:

  • the recognition from the previous mobile experience allowed her to avoided her first mistakes

  • the task was finished even faster after one experience.

​

Other study cases

Remote design sprint mentored by the Design Team youtube channel

Course case study at Aela
 

Course case study at Aela

JamiQ Dashboard Redesign
 

UFRJ Landing Page Redesign

​

Miaudota ONG Design Sprint

bottom of page