Maizefndr was designated as a campus involvement app for the University of Michigan. This semester-long project followed the UX research and design process to evolve from defining needs to generating a mid-fidelity prototype, which is linked below.
Role: UX Research, UX and Interaction Design
Tools: Miro, Figma
Time: August 2021 - December 2021
Define
New students, such as freshmen, transfer students, and graduate students who were not previously on the Ann Arbor campus are expected to be familiar with the methods to become involved; however, major campus involvement events such as Festifall only occur once a year and are not well advertised to this demographic. The current solutions and platforms available also pose their own issues; Maizepages, the current extracurricular platform, is quite outdated, not mobile-friendly, and generates too many results to filter through. Social media for some clubs is not centralized and varies club to club; there is no consolidated social media platform for all. Sometimes, there is not even a way of telling if an organization is still in existence or accepts a certain genre of students. And more recently, many students are returning to campus after a long period of isolation during the onset of COVID-19; with this, a large portion of the U-M student body is looking to get re-involved on campus and should be able to use an adequate platform to do so.
Once the main goals and objectives of the issue were defined, a potential tool was proposed that could address each objective. This application is to be used by three types of people – U-M students/general members, faculty advisors, or club administrators. For this use case, I focused on the project from a student’s perspective and user experience.
Brainstorm
Keeping these in mind, the prototype of the application was designed with the “members” option in mind. These students could be from any background, demographic, and nationality, and it is preferred they are either within walking distance to campus or possess access to transportation if located further. These users should also own a smartphone and be fairly familiar with social media formatting.
As for the social aspects of the system, it falls under the individual/group category. The user’s own set preferences would be individual, but the organizations and events themselves all group-oriented, allowing that individual to connect with others. In other words, this system is individual on a small scale and group aspect on a larger scale.
INTERACTIVE MAP: Upon opening this platform, a student can view all the current events/meetings occurring in their immediate surroundings. They can also zoom in on other areas/buildings to view which events are located there; student can share locations of events/meetings with each other, and view pictures/live feed from that event if participants decide to post and geotag them.
MAIZE PAGE UPGRADE: By translating Maize Pages into a mobile-friendly app, students can more easily access and view campus orgs when they are on the move or casually browsing. This app will also improve the workflow of Maize Pages, providing up-to-date information about organizations and employing better filtering methods to prevent students from having to scroll through 1000+ clubs.
CALENDAR EXTENSION: An application along the lines of a scheduling/planner app where students can register for events and then sync them to a personal calendar would be very helpful to those whose orgs all contain different modes of communication.
UNIVERSITY FORUM: Inspired by posts on Reddit, this idea would involve a forum spearheaded by students (using U-M credentials to use it) in which they would review extracurriculars and events. This would be especially beneficial for individuals new to U-M, in which they could get a feel for the club without the anxiety associated with joining something completely new.
MATCHING SERVICE: This idea revolves around the idea of a “matching” based on a student’s preferences that they can set when first using the app. These matches will appear as a “feed” that the user can scroll through. The feed could also have some “suggested” events sprinkled in if the user would like to try out something new and step out of their comfort zone.
VIRTUAL POSTING BOARD: Like a physical posting board that one might view in a building, this idea translates that platform onto a digital surface. Students can “unpin” club/event flyers than are not relevant to them and keep up the ones that are. Students can change filters to view specific campus-wide events and organizations. Posts will also lose visibility once an event is over/cancelled, or a club is no longer taking in new members.
AR CAMERA: A camera which contains an AR overlay (similar to Pokémon GO) to view events/clubs happening around them in real-time. Similar to the interactive map (#1), this tool would enable students to view campus-related activities occurring nearby by pointing the camera at areas and buildings over campus. Details of each event/meeting will appear when the user selects them, and they can decide whether to attend or not.
DICE ROLL METHOD: To encourage students to try out new things and get to learn more about the campus community, this “dice roll” style app will require the user to shake their device and randomly display an event/club meeting that will be taking place within the next hour. Details and location can be viewed, as well as contact information. In the spirit of college, this gamified technology is meant to be spontaneous and unplanned.
Each potential idea underwent a QOC analysis as depicted above. The main question to be addressed came from the goals defined earlier, and the criteria was defined by performing user research and conducting interviews. I began mapping out each option to corresponding criteria, and it was found that the Matching Service (sketch #5) solution fulfilled the most criteria that the question procured.
Research
While designing and determining potential solutions, I utilized user research to develop personas of potential users. These personas reflected the real needs, behaviors, and personalities of the individuals targeted during user interviews. I wanted these personas to provide a holistic overview of the user that could inform their potential journey and interactions within the product, accounting for their unique characteristics and goals. For this project, I utilized Jackson’s persona (pictured above) as the use case for Maizefndr. Other potential personas can be found below.
A common path story map was generated to depict the overall information architecture that the user could encounter within the app. There are four main concepts in the top (pink) row: Register, Explore, Join, and Customize. Each of these break into components, or features (purple) that allow the user to achieve that concept’s goal. The last level of this hierarchy are the functions (blue) that the features will provide within the application. From a design perspective, we could approach the concepts as organisms, the features as molecules, and the functions as atoms or UI elements. The path follows a format from left-to-right as the user explores each aspect of the app in a streamlined and chronological order compatible with their persona.
For Jackson, this user flow diagram takes him through his user journey in the form of various use case flows and logic loops that accounted for user input and variability. This step of the design process was imperative in understanding not only how the product could be prototyped, but also ensuring that the flow was logical and each screen contained a purpose in its flow position.
Each block in the user flow diagram was then translated into its corresponding wireframed screen to effectively visualize the product’s flow. All element interactions that project the user from the current screen to the next one are highlighted by yellow boxes.
Ideate
After wireframing, each screen was redesigned and refined into a mid-fidelity version. Now, let’s learn a bit more about the Maizefndr app!
For the Onboarding process, users are prompted to input their year, program, and interests to the best of their abilities. They are then able to enable calendar sync to automatically add club events into a personal calendar, location services to navigate to events, and create their user profile on the spot, which may/may not be visible to other users on the app.
Once the user has completed onboarding, they can view their Home Feed, complete with a picture of each org and a small descriptor. The user can “like” clubs that they are interested in and view later or peruse the comment section on them. The comment section allows individuals to comment, reply to comments, and upvote (like) or downvote (dislike) comments. This encourages discourse among users and fulfills the goal to “feel the vibe” of an organization, which many interviewees had expressed to be an important aspect of searching for potential clubs.
On each Club’s Page is a photo gallery, along with an up-to-date roster, with the option to contact executive members. Lastly, the user can join the club on the app itself; this function can differ from club to club (some can simply be joined, others have an audition process, form to fill, etc.). Once a user is registered, they can view their personal clubs in their home feed simply by using the “My Clubs” slider. This feed also links to each club’s group chat so the user can access them all from the same platform
Lastly, the user’s Profile allows them to see a shortlist of their registered clubs, liked clubs, and past events. They can always make changes to their profile or go into their settings to update preferences whenever they feel it is necessary. This is also where the user can go to log out of the app.
Reflect
The Maizefndr app is customizable, current, and collaborative. The social impact of this project is to challenge U-M students to step out of their comfort zone and explore different categories in their extracurricular pursuits, to make communication easy on a single platform. Students should no longer be hesitant to consider organizations because they are unsure what the people are like, if they are qualified, or if the club is even still in existence. These were all valid concerns shared during the User Research process, the hope is that Maizefindr can lessen some of those worries.
But what makes this app really stand out, its “wow” factor, is that it is consolidated. No other tool found during the competitive analysis combined all of these functions, and instead chose to specialize in a few. A recurring issue within clubs is that so many different channels are used for different things; a formal/informal registration process, announcements over social medias, group chat platforms. This is a tool which contains all, but the interface is not overly complicated, and is in fact, a familiar one. The Home feed and Search tool are modeled after Instagram, the comment section after Reddit – users will not have to waste any time becoming acquainted with the product and instead accelerate towards their goal of exploring organizations, joining club communities, organizing their extracurricular calendar.
This platform is quite feasible technology-wise; smartphone application technology and a decent amount of information input/backend work will be required and take a lot of effort, but the actual implementation/interface should not be difficult once that is complete. That being said, the tech and resources already exist for this project’s implementation, the manpower is all that is left. Clubs will have to input their information, roster, and registration processes, and keep these updated or their page will be removed. There is a need, therefore, for moderators on the platform. The app is also linked to the University, so there would be some legal/logistic processes to undergo to make it available to the U-M community.
What I learned
-
![]()
Know exisiting solutions
The competitor analysis revealed that some of the competitors’ weaknesses included pricing, not being easily accessible to students (only universities have access), poor mobile design, and/or lack of organization information. Without understanding the strengths and weaknesses of these competitors, I would not have a direction in what would give my design a competitive edge, which is the consolidation of many different features
-
![]()
user data is power
Needfinding and user research taught me that students’ main criteria for joining a club is that the members are compatible with them. Students also stated their frustrations with current solutions was that either things were out-of-date (Maizepages), informal (social media), or infrequent (Festifall). This stage really helped me understand the target users and visualize how they would want to interact with the product.
-
![]()
operate from multiple perspectives
User testing was a personal favorite, and definitely aided with the placement and sizing of certain icons once I was able to see where users were naturally inclined to interact with the interface. For instance, the user Profile form contained both an X mark and Check mark on the top left and top right, but a few users stated it may be easier for the Check mark to be near the bottom, naturally placed after filling everything out in the profile.
-
![]()
trust the process
I learned how important that each step in this process is in developing a fully fleshed out, final design. Simply jumping forward into prototyping, or even sketching, would have generated an entirely different design because there would be nothing to give each element a purpose. I realized the importance of research, establishing a concrete need for the product, and continuously tying the design elements back to this goal. The final prototype I generated looks drastically different than the one I had envisioned when first thinking of the problem, and in the most optimal, effective way.
