“We need a website that empowers users to connect with their community.”
My Role
Led and redesigned Spectums’s website to achieve AODA compliance and alleviate other accessibility pain points by reinforcing design decisions with research and user testing within a turnaround of four weeks.
The Team
Brooklyn Louis (Social Media Designer)
Brannon Moore-Goldsmith (Graphic Designer)
Jason Yao (Graphic Designer)
Myself (Lead and UI/UX Designer)
Tools
Figma, Adobe Illustrator, Adobe Photoshop, Notion, and Microsoft Teams.
Problem Statement
This project's scope is to create branding deliverables for a nonprofit organization, including a website. Issues with the old website include navigational issues, lack of AODA compliance, reliance on third-party websites, and lack of language options.
Solution
Solutions include utilizing WordPress plug-ins, ensuring AODA compliance, call-to-action buttons, and a minimalistic footer design. The new website ensures AODA compliance, solves navigational issues and eliminates reliance on third-party websites. It also provides language options and a hotkey to escape the website in a time of panic.
Research
I started by checking through the website for inconsistencies. Header images, buttons and font selections varied from page to page. This issue was followed with lack of contast for pages that utilized colour. To fix this the group and I decided to select colours that would help the website meet AODA compliance.
Afterwards, I did a website audit to see the webpages that were last updated to use as a base point of crucial pages to include during the websites rebrand. I was shocked to see that some webpages did not feature any images. After digging further it became apparent that the webpages did have images although they did not have alt text. This means screen readers would not be able to access any information if someone accessed the webpage with a screen reader. Furthermore, the websites blog area is a helpful tool for people around the world to educate themselves. Ensuring an option to change the language is crucial for accessiliblity needs.
Finally, I began user testing. My main takeaways was the website was tough to navigate to find information on events, accessing the shop, and general navigation through the websites many pages. I decided to do hybrid card sorting to get a better understanding of the user flow before designing solutions to these painpoints.
Features
ESC Key:
Using the ESC key to allow users to have a sense of safety when browsing the site is important for those who are questioning their gender or sexual identity. Utilizing this feature will enable individuals to learn more about themselves in a controlled, safe environment that the user can control.
Language Preferences
While conducting the audit, it became apparent that the site is accessed worldwide and the blog posts likely act as a way for people to gain knowledge about 2SLGBTQIA+ communities. Ensuring that language is customizable would help accessibility for those who speak a different language. French was chosen as a starting point before adding more languages, as French is Canada's second language.
Wordpress Applications:
Users had difficulty accessing and navigating the site due to its shop page being hosted on a separate URL. Adding WooCommerce would bring the shop page to the site natively, improving navigation. In addition, users struggled to quickly find events, so using a plugin like The Events Calendar would help make it easier to manage and visually find events.
Personas
Rosa is a 19 year old gender fluid individual apart of the community. They believe that queer mental health is important and should be a priority for teens and young adults. They would like to become a frequent member of Spectrum’s many events to meet new people.
George is a 57 year old cis bisexual man that has recently shown an interest in Spectrum. George owns a business in Toronto and would like to look into supporting Spectrum by donating and hiring them to educate his staff about the queer community as the company is growing with new and diverse staff.
Goals
donate to the non-profit
learn more about the community
make a difference for staff members
Stressors
trouble using technology
busy schedule
Goals
help build community involvement
interested in attending events
wants to meet new people
Stressors
meeting new people is scary
mainly speaks French
incredibly busy scehdule
Creek is a non-bindary 34 year old that indentifies as pansexual. They would like to support the community by donating their time to help ensure events are inclusive, engaging and informational.
Goals
help individuals feel welcomed
interested in hosting events
empathize with the community
Stressors
nervous to get involved
disorganized with current schedule
unsure about how events will run
Process
Low-Fid
Final
Before
Reflection
Working as a UX designer in a group setting was an interesting and rewarding experience. I learned a lot about working with a team and collaborating to find the best solutions. We had to make sure that everyone was on the same page and that our ideas were well communicated so that we could come up with the best solutions. We also had to be aware of each other’s limitations, strengths, and weaknesses and worked together to make sure that everyone was contributing effectively. We also had to be open to feedback from each other, and try to incorporate changes into our designs. It was a great experience and I learned a lot about working effectively with a team.