Minerva

saveen toor
Nov 3 · 10 min read

As the Minerva organization grew, it became increasingly important for them to create a secure, safe platform for the girls from the Learning to Lead Program (A mentorship program at Minerva) to stay connected and maintain relationships with one another along with, staying connected with the Minerva alumni after their annual events. Minerva is a “non-profit charitable organization that supports women and girls throughout the province to gain the confidence and skills they need to reach their leadership potential” they're goal is to help connect young girls in high-school with mentors. With nearly over a 100 girls attending these events annually, it was clear that we needed a more systematic way other then facebook groups to help them stay connected.

This project was planned and executed by my team of five:

I took the lead and my role was to:

Conduct user experience (UX) research and testing

Organizational and domain research

Developing wireframes and task flows based on user needs

C reating a clickable prototype based on our research results

Keeping in contact with our client to ensure they were involved throughout the process

Activity and resource planning

Organizing and motivating my team

Monitoring our progress

Our biggest obstacle and challenge we needed to keep in mind while creating this platform was the security. Our clients wanted to make this app very secure where only individuals connected with Minerva were able to join and access it.

We researched and analyzed the follow apps to gage a better understanding of what our users needs and wants would be. We compared all the features each app had and did not have as shown in the chart below.

I prepared a survey with Google Forms and distributed it among multiple groups within the Minerva organization, facebook groups the girls had created and Reddit.

The purpose was to determine the basic ways these girls stay connected with one another after attending Minerva’s networking events. Learning about the problems of potential users is a great way to be inspired and motivated. Working with real world data is a good staring point to help avoid guesswork and preconceptions.

Using this information provided a better chance to discover the root of the problem and how to overcome it.

Online research from the surveys led me to the following key findings:

1. Secure Platform

To solve the problem of keeping this platform secure and only for individuals connected with Minerva, it was important for us to figure out the best practices to use while logging in and creating an account.

2. A Design System

The primary solution was to come up with a design system that was guided by principles and best practices. Also, to keep track with documented at each step to ensure consistency and efficiency of work.

3. Personalization

To solve the problem of complexity it was important to eliminate any unnecessary elements. To achieve that, the platform was made persona specific.

The results of my survey suggested that there were two primary types of users with diverse needs. The accumulation of the different insights and common patterns that came from the users’ answers helped me create two personas one for the mentor and one for the mentee which are the manifestation of that data in a character.

Focusing on a specific user helps to keep there needs in mind and not get side-tracked from the goal, whenever an idea for a new feature or demand pops up.

Next, my team and I created a storyboard for each persona.

“A storyboard in UX is a tool that visually predicts and explores a user’s experience with a product. It can help UX designers understand the flow of people’s interaction with a product over time, giving the designers a clear sense of what’s really important for users.”

MVP is the minimum viable product which means that is what we focus on first while creating the base set of features for the first version of the app which reaches the users needs.

After our research we did an affinity diagram to gather all the information collected from surveys and interviews to see what users wanted.

The first step was to review every aspect from our survey and interview results and try to list all the important components on a sticky note, then group elements by their usages together.

For example, from our features we were able to narrow down what our users were looking for in the chat. Assets such as group messaging, being able to send different types of content, finding people with similar interests, and a way to be notified of upcoming events.

During this process, many inconsistencies emerged. Without worrying about them at that point, I documented everything in the form of screenshots.

“User flow is the path taken by a prototypical user on a website or app to complete a task. The user flow takes them from their entry point through a set of steps towards a successful outcome and final action, such as purchasing a product.”

Below is a diagram of the user flow we created:

Testing was conducted during the discovery phase to identify the biggest pain points in the current version. During the redesign: User Testing was done at every milestone of the project. Invision, sketch and paper prototypes were shared with peers and useers to get early feedback.

Lo-fi prototyping is the next step after the planning phase. Lo-fi’s are a loose representative of our idea. They are a Quick and easy way of easing out any issues or roadblocks in our design before creating the mid-fi’s. They are created for getting quick feedback and improving the product before we start developing the wireframes. We created a set of paper wireframes as shown on the screen, which we then tested with a variety of users by assigning a set of tasks, and we then made changes accordingly.

We then proceeded with Lo-fi testing. After creating the Lo-fi’s we then tested them on users and observed how they were able to complete the following tasks such as:

The reason we did this was to see how users would interact with our design and if they were able to successfully and easily complete the tasks without confusion and difficulty.

We then took the feedback and made more changes to the prototypes. Such as removing a screen in the on boarding to confirm if the user was a women.

We did this so we were able to give the users the best experience possible.

We then took that feedback and made more changes when creating our Mid-fi prototypes.

This is a quick peak into our mid-fi prototypes. This is a more concert representative of our idea and a stepping stone from our paper prototypes. The prototypes shown above were designed and developed keeping in mind all the changes we’ve made from each phase after user obtaining feedback from user testing. This is what we then passed on to the UI team for them to skin.

1. Getting everyone onboard

Developing wireframes and task flows based on user needs is not a one-man project and if you want it to succeed you need everyone to be on board. The more integrated you want it to be the more disciplines you need at the table.

2. Planning & Priority

Failing to plan is planning to fail. We constantly toggle between working on our Wireframes and User Testing and enhancing the application and planning and prioritizing our tasks is imperative.

3. Breaking this news to clients

Although, our clients wanted to create this platform from a long time. Yet, it was very important that we kept them involved and excited about the big changes we were planning

While creating these components, we collected them in a sketch master file, which we referred to throughout the planning process. After two weeks, once our research was completed and after testing our paper prototypes we began creating our wireframes in sketch. We saw huge leaps in productivity by using the iOS library when iterating on designs in sketch.

While the library was growing, we started organizing individual components into art-boards which contained similar items. We had divided the screens between the three of us UX Designers to tackle wiring framing in the most productive and fastest way possible as we were on a time crunch. Our goal was to deliver the files to our UI team 2 days before schedule as we knew there was much work to be done. Being familiar with the UI process, we understood what an impact two extra days would make to them.

These art-boards were then organized by general category into Navigation, Menu, Buttons. Later we planned on how to create an internal documentation system that can be used by both the development team and the designers to make our handoff easier.

Out of all the problems solved I would like to showcase one of the primary problems we discovered in our user testing which was that in the on boarding before the personal details we created a screen to verify that the user was a women. As this app is only for women within the Minerva organization. But since creating a secure platform was one of number one goals, user would only have access to download this app through via an email invitation from an admin. Thus we did not need the verification screen. So, while proceeding through on boarding, the first screen would be the personal details screen as shown belive.

We needed to make our app on a iOs platforms for mobile devices. Modules and features used on mobile are limited. But, Keeping designs synchronized takes significant effort, and often requires the same work to be repeated across all of these platforms in an efficient manner.

  1. Collaboration is key
    The more eyes on a design, the more it’s exposed to varying opinions, experience, and critique and this can only ultimately improve it. Or at the very least, test it.
  2. Process in essential
    For a project that is vast, it gives you a roadmap to navigate through what can be a foggy route. This is especially useful when you’re starting out.

Numerous hours of brainstorming, carefully planning, conducting user experience (UX) research and testing, organizational and domain research, developing wireframes and task flows based on user needs and creating a clickable prototype based on our research results and designing has brought the results desired for the Minerva app. We are so pleased to present the new secure safe app to our client. The final result of the stay connected system is a platform is a light, minimalistic, and an intuitive experience personalized for each user persona to help them achieve everything they had hoped to obtain from this app.

Link to InVision prototype: https://projects.invisionapp.com/share/G3TDWD6TPCB#/screens

If you enjoyed this article, please hit that clap icon!

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade