SMC-GO App
Introduction
SMC GO is Santa Monica College's mobile app with the necessary information and tools for current and prospective students. In this project, we were asked to redesign the app so that it would be more successful, easier structured and meet the students needs
My Role:
Designer
Research designer
Prototype
Time Frame:
7 weeks
Creative Brief
Problem Statmement
Objectives
Expected outcomes
Based on the statistics, students seem to download the app in the beginning of a new semester but to current data, it is not being used as frequently as we would hope.
That the user will download, keep using, and taking advantage of the helpful tools that the app offers tough out their whole academic journey.
The user will be confident knowing that they can get all the information they need through the SMC GO APP. They will experience an easy, accessible, and helpful tool that they will take advantage of in their education and social life.
The Process
1
2
3
4
5
6
Research
Ideation
Low-Fy wireframes
Usability Testing
Prototype
Final Outcome
RESEARCH
Stakeholder Interview
We first met with the stakeholder to ask any questions that we had after reading the project brief.
Esau Tovar
Dean of enrollment
services and Faucalty leader
Cleve Barton
"The school needs to, each year, drop a lot of students because many students forget the deadline date of paying their fees."
"Success may be measured based on how many times the app is downloaded and also how many users that allows push notification."
Admission & record department at SMC
Student interview
Persona
Competitive Analysis
I did some secondary research and investigated the school app of three other universities, their features, and how they worked. Based on that we were able to narrow down pros and cons of each app.
IDEATION
Tone & Charater Attributes
Now that we gathered some valuable insight from the research phase, we went into the ideation phase, where we wrote down and mapped out what tone and attributes the ap should communicate.
● Formal
● Warm
● Social
● Helpful
● One-stop-shop
● Easy to navigate
● Accessible
● Modern
● Simple
● Stuffy
● Business-like
● Overwhelming
● Information overload
● Outdated
● Redundant
● Overwhelming
● Hyperlink based
● Unreliable
Content tonality
Feature Matrix Development
We then used sticky notes so that we could map out the most Important and necessary features. Then we used a valuable diagram to get a underating in which one of those was our area of focus.
Sitemap
For Marketplace & Comminucation
Now that we had decided on the app's essential features, we could create a sitemap to see how the categories and subcategories should be organized.
LOW-FI WIREFRAME
Story Board
We came up with a possible scenario where our persona, Dominic, would take advantage of the feature we decided to focus on: the marketplace.
Dominic has an old math book he does not use any more & he needs money for some new furnitures in his apartment.
He had recently heard about a feature on the SMC GO app where one could buy and sell stuff.
He takes a photo of his book with a short description and post his add.
Sara replies and wants to trade his book for a chair. Perfect, he thinks. A new chair is one of the items he needed for his new place.
Dominic has an old math book he does not use any more & he needs money for some new furnitures in his apartment.
Dominik is super happy. He now got a new chair, and at the same time got rid of his old math book. So convenient.
USABILITY TESTING
Feature Scenario Wireflow
We sketched out the scenario and any possible screen likely to be involved in that interactive process. We used a whiteboard to make changes during the process smoothly
We did usability testing on our rough wire flow with other students to catch any errors and figure out what did and what did not work. Based on the feedback we received, we made changes and added new features.
Key-Takeaway
-
Switch the screen of "upload photo" with the screen of "Create an ad".
-
Add a button in the right corner.
-
Organize content differently (Button, description before tags.
-
Add a function/button that lets the user preview the ad.
-
Option for trade vs sell.
-
How could they swish between "trade or sell" - (switch button?)
With the Feedback we gathered from user-testing, we were able to create Hi-fi wireframes to show the visual process when we presented our concept to the stakeholders.
From Insight to Action
The feedback we received from the stakeholders and the class when we have presented our concept that creating a marketplace for students inside the app was a great solution and would hopefully create community and reliability.
They also pointed out the importance of taking safety into concern when developing that kind of feature.
Additionally, one crucial question that was brought up regarding the communication channel on the Marketplace and if it should be a feature located there itself or send the user directly to another platform. Something we may need to research further in order to see what is requested by the target audience.
PROTOTYPE
Visual UI Design
Let's try it out!
Final outcome & reflection
During this project, I experienced and understood how valuable and essential the research phase is in the design process. Furthermore, the importance of dividing the work effectively in a group projects like this and also frequently have good communication throughout the whole process to have the ability to work more time-efficient and, more importantly, focus that time on the essential issues.
Moreover, I understood the importance of wire flow and prototype testing in the design process to spot any arrows with the module and then have the ability to go back, tweak and therefore improve our outcome.
I did not realize that in this way, we were able to open up our eyes and have the ability to think outside our own minds. Since we are designing for others and not for ourselves - things that may work well for some people do not necessarily work well for others.