Urban Fellows Alumni Association:
Redesigning Connectivity
website redesign
project overview
The Urban Fellows Alumni Association (UFAA) is a nonprofit organization for former participants of the New York City Urban Fellows Program, including former fellows and supervisors of current fellows. This project aims build upon UFAA existing web content, enhance usability, and improve the user experience to facilitate alumni engagement on a website platform through the use of research insights, personas, user experience testing, wireframing and prototyping.
my role
- Conduct user interviews, card sorting, and tree testing exercises for informed design decisions.
- Develop strategies to enhance website engagement and restructure information architecture.
- Design wireframes, logos, and UI for the reimagined home and events pages of the website.
team
tools
Figma
Optimal Workshop
Miro
Akshata Karekar
Ruhee Shah
Jichen Zhu
Kira Zimmerman
duration
14 weeks
the problem: 86% of alumni association members faced challenges with the website's functionality, which hindered its approachability and usefulness.
Our research revealed that engagement, connectivity, and support are vital to maintaining a thriving alumni community, necessitating a singular online platform offering seamless connections with peers and cohorts. To address this, we introduced two impactful minimum viable products: an events section and a donations section, encompassing the key elements of fostering alumni unity. The key features I wanted to solve for are:
Through a prominent and functional events system
alumni engagement
alumni support
Through a functional donate section
the solution:
An interactive platform that fosters alumni engagement, grants convenient resource accessibility and facilitates the development of an online community for NYC Urban Fellows.
my design process
9 weeks
5 weeks
DISCOVER
DEFINE
DESIGN
PROTOTYPING
-
User Research
-
Market Research
-
Website Analysis
-
Defining project goals
-
Card Sorting
-
Tree Testing
-
Information Architecture
-
Sitemaps
-
Design Conceptualization
-
Lo-fi Wireframing
-
UI Design
-
Hi-fi Designs
-
User Testing
1
Finding out the purpose for user's interaction with the website
user research key insights:
Can the user reach out to other alumni members easily through the website?
Alumni feel like they are not connected to the alumni out of their year. They do not have a database of previous alumnus to connect with.
Is the user updated on the recent events of the UFAA through the website?
Alumni wishes to be updated on current events and networking opportunities via virtual events, email newsletters and Facebook groups and sign up for them.
Is the user aware of how to virtually connect with, to get involved in events hosted by the association?
Users would like to be able to share news and receive news from other members of UFAA and would like an option to search and find mentors.
2
What About The Rest of The Fish in The Sea?
learning from our competitors
After learning about our users, we needed to place ourselves in the market. How do we do that without knowing the whereabouts of our competitors?
Our team reviewed eight competitors’ websites in order to assure that our final deliverable follows best industry practices. Our study evaluated the performance of each competitor site based on their homepage, search, organization, content,navigation, appearance, features, and links and labels. We concluded this analysis by compiling key insights about competitor sites.
This is a very helpful step towards the ideation of our website since we were able to go onto these competitor website as users not designers to determine if the experience was effective or not.
Competitor ratings (click to enlarge)
proposing takeaways
We concluded this analysis by compiling key insights about competitor sites.
We proposed the following takeaways:
1. It is essential to make sites attractive and well-organized;
2. Networking features need to be user-friendly to be useful;
3. Successful site navigation depends on clear links and labels; and,
4. Visual elements can make or break brand trustworthiness.
3
Structuring and Restructuring Content
mental model makers
To gauge the mental models of your users and how they would navigate through the website, we performed a card sorting study and a tree testing study on 13 participants. From this study we analysed the following key findings from which we created our site map.
1. Users are highly career-oriented and are likely to go to a Career Resources page for
information about UFAA unless given a more explicit navigation path.
2. Users navigate most efficiently when labels are clear and merged under one heading.
3. Users are interested in LinkedIn as a career resource rather than a social network.
4
Bringing Our Sitemap to Life
UFAA Sitemap
creating easy task flows
Our team decided on having two MVPs, the events and donations section. The reason for this decision was that both events and donations are the most ideal way on the website for alumnus to be connecting with each other. The team collectively created a task flow for our events section to outline every possibility towards reaching our task goal.I ideated all our decisions through sketches and wireframes that facilitated the tasks on the right.
"we want to help users find events and RSVP for them"
"we want help navigate users to donating to the UFAA"
Task flow for events (click to enlarge)
user testing our wireframes
As a team we designed our mid-fi prototypes, I worked on the event RSVP pop up tasks from the beginning to the end. The key tasks that I presented at this stage were a way to log in, fill up the RSVP form, and then a way to cancel the RSVP. Then I tested the prototype with two users that gave me some great insight on the structure and placement of information on the webpage. A lot of the information that was intuitive to us was not for the users, which is why testing before we went hi-fi turned out to be very advantageous.
-01.png)
5
The Final Version: Our User's Right Hand
website customized for our user
Based on all the user feedback our team received from our tests, we fixed some major and minor mistakes. We reviewed our pages and finally styled our mid-fi prototypes into hi-fi with real images and web content edited copy, with the help of the brief UI guide our team designed. Below are all the updates we made on our hi-fi followed by a working link to the prototype.
the homepage
the events page
the RSVP pop up
the donations page
Problem Solved and Project Pitched
the conclusion
Like mentioned before the issue with the functionality of the website was that it lacked the ability to be approachable and useful to its members. Our problem to solve was to make interaction between the Urban Fellows members seamless. Our team achieved this by building through a prominent and functional events system, and a donation page structured in the most user-tested intuitive way. Our clients thoroughly enjoyed looking at the rebrand of their website, and our design decisions received a positive remark.
alumni engagement
Through a prominent and functional events system
alumni support
Through a functional donate section