Role

Lead UX Designer & Researcher

Duration

2 weeks

Tools

🌱 Introduction

🌱 Introduction

When I learned about Bitesize UX's accessibility workshop, I felt it was a perfect opportunity to improve my skills.

My goals were to:

  • Elevate Visual Proficiency:

    Throughout the workshop, I dedicated myself to refining my visual skills, while prioritizing accessibility and inclusivity in my designs.

  • Expand Design Horizons

    Stepping out of my comfort zone, I ventured beyond my usual realm of mobile application design. Venturing into the realm of website design, I sought to elevate my capabilities to new heights.

When I learned about Bitesize UX's accessibility workshop, I felt it was a perfect opportunity to improve my skills.

My goals were to:

  • Elevate Visual Proficiency:

    Throughout the workshop, I dedicated myself to refining my visual skills, while prioritizing accessibility and inclusivity in my designs.

  • Expand Design Horizons

    Stepping out of my comfort zone, I ventured beyond my usual realm of mobile application design. Venturing into the realm of website design, I sought to elevate my capabilities to new heights.

Role

UI/UX Design Intern

Duration

April 2022 - September 2023

Tools

👀The Problem

👀The Problem

🔭 Exploring the Pre-Exisiting Website

🔭 Exploring the Pre-Exisiting Website

Research : Accessibility Evaluation

Research : Accessibility Evaluation

SeniorTix is a website that offers discounted prices for senior citizens to enjoy a variety of events, tours, and group activities. It is a community platform that brings seniors together to socialize, learn, and stay active.


⭐️ Senior citizens who have visual / cognitive impairments may require additional design considerations to ensure that they can use the website comfortably


SeniorTix is a website that offers discounted prices for senior citizens to enjoy a variety of events, tours, and group activities. It is a community platform that brings seniors together to socialize, learn, and stay active.


⭐️ Senior citizens who have visual / cognitive impairments may require additional design considerations to ensure that they can use the website comfortably


🔍 Educating about Accessibility

🔍 Educating about Accessibility

Research : Research Accessibility Guidelines

Research : Research Accessibility Guidelines

In my efforts to enhance the SeniorTix website, I quickly grasped the importance of making it accessible to all users. To truly understand this crucial aspect, I immersed myself in the Web Content Accessibility Guidelines 2.1 (WCAG 2.1).



I took care in selecting colors that meet the Level AA conformance standards.

My aim was to ensure accessibility without sacrificing the site's visual appeal.

Each color choice was made with thoughtful consideration, striving to create a welcoming digital space for every visitor.

In my efforts to enhance the SeniorTix website, I quickly grasped the importance of making it accessible to all users. To truly understand this crucial aspect, I immersed myself in the Web Content Accessibility Guidelines 2.1 (WCAG 2.1).



I took care in selecting colors that meet the Level AA conformance standards.

My aim was to ensure accessibility without sacrificing the site's visual appeal.

Each color choice was made with thoughtful consideration, striving to create a welcoming digital space for every visitor.

👀 The Problem

🌱 Introduction

When I learned about Bitesize UX's accessibility workshop, I felt it was a perfect opportunity to improve my skills.

My goals were to:

  • Elevate Visual Proficiency:

    Throughout the workshop, I dedicated myself to refining my visual skills, while prioritizing accessibility and inclusivity in my designs.

  • Expand Design Horizons

    Stepping out of my comfort zone, I ventured beyond my usual realm of mobile application design. Venturing into the realm of website design, I sought to elevate my capabilities to new heights.


📝Rapid Sketching

📝Rapid Sketching

Design: Crazy 4's

Design: Crazy 4's

To generate new ideas for the redesign, we did the "Crazy 4's" exercise!


Building off of the usability test results, I decided to focus on these specific areas:

  1. Activity Cards & Filter Buttons

    Increase the size of fonts, buttons, cards to improve their visibility and ease of use, especially for older users.

  2. Navigation Menu

    Remove the navigation menu as there is a lot of redundant / repeated information that can easily be implemented onto the main screen itself.

  3. Simplifying the User Experience

    Provide clear feedback such as confirmation / clickable elements to inform the user of what is going on while navigating through the SeniorTix website.

To generate new ideas for the redesign, we did the "Crazy 4's" exercise!


Building off of the usability test results, I decided to focus on these specific areas:

  1. Activity Cards & Filter Buttons

    Increase the size of fonts, buttons, cards to improve their visibility and ease of use, especially for older users.

  2. Navigation Menu

    Remove the navigation menu as there is a lot of redundant / repeated information that can easily be implemented onto the main screen itself.

  3. Simplifying the User Experience

    Provide clear feedback such as confirmation / clickable elements to inform the user of what is going on while navigating through the SeniorTix website.

💫Uncovering usability issues

💫Uncovering usability issues

Design: Iterative Test & Redesign

Design: Iterative Test & Redesign

To continually test my design, I turned to the Chrome extension Funkify.


Funkify is a wonderful tool because it lets me experience the web through the lens of users with disabilities. This perspective guided me as I iterated on my design to better meet their needs.


To continually test my design, I turned to the Chrome extension Funkify.


Funkify is a wonderful tool because it lets me experience the web through the lens of users with disabilities. This perspective guided me as I iterated on my design to better meet their needs.


💻 The Final Design

💻 The Final Design

Design: Hi-Fi Wireframes

Design: Hi-Fi Wireframes

The Improvements

  • I created clear & concise labels that make it easier for the user to read and understand.

  • Increased font size & buttons for the event cards and filter buttons for users to click on easily

  • Made "Tutorials" accessible just in case the users needed additional assistance


The Improvements

  • I created clear & concise labels that make it easier for the user to read and understand.

  • Increased font size & buttons for the event cards and filter buttons for users to click on easily

  • Made "Tutorials" accessible just in case the users needed additional assistance


☀️ Reflecting on the Project

☀️ Reflecting on the Project

Admittedly, I encountered challenges along the way.

  • In all honesty, crafting this design took time. I discovered the intricacies of accommodating various needs and preferences within a unified design framework, from cognitive and visual to motor abilities.

  • This project didn't involve specific metrics and was my first dive into designing for accessibility, so this added layers to the process. But to me, the investment of time and effort proved invaluable, elevating my skills as a designer.


Despite the hurdles, each phase of this journey was meaningful.

Expanding upon this workshop project deepened my understanding of accessible and inclusive design principles.

Admittedly, I encountered challenges along the way.

  • In all honesty, crafting this design took time. I discovered the intricacies of accommodating various needs and preferences within a unified design framework, from cognitive and visual to motor abilities.

  • This project didn't involve specific metrics and was my first dive into designing for accessibility, so this added layers to the process. But to me, the investment of time and effort proved invaluable, elevating my skills as a designer.


Despite the hurdles, each phase of this journey was meaningful.


Expanding upon this workshop project deepened my understanding of accessible and inclusive design principles.

Role

Lead UX Designer & Researcher

Duration

2 weeks

Tools

🌱 Introduction

When I learned about Bitesize UX's accessibility workshop, I felt it was a perfect opportunity to improve my skills.

My goals were to:

  • Elevate Visual Proficiency:

    Throughout the workshop, I dedicated myself to refining my visual skills, while prioritizing accessibility and inclusivity in my designs.

  • Expand Design Horizons

    Stepping out of my comfort zone, I ventured beyond my usual realm of mobile application design. Venturing into the realm of website design, I sought to elevate my capabilities to new heights.

🌱 Introduction

When I learned about Bitesize UX's accessibility workshop, I felt it was a perfect opportunity to improve my skills.

My goals were to:

  • Elevate Visual Proficiency:

    Throughout the workshop, I dedicated myself to refining my visual skills, while prioritizing accessibility and inclusivity in my designs.

  • Expand Design Horizons

    Stepping out of my comfort zone, I ventured beyond my usual realm of mobile application design. Venturing into the realm of website design, I sought to elevate my capabilities to new heights.

🌱 Introduction

When I learned about Bitesize UX's accessibility workshop, I felt it was a perfect opportunity to improve my skills.

My goals were to:

  • Elevate Visual Proficiency:

    Throughout the workshop, I dedicated myself to refining my visual skills, while prioritizing accessibility and inclusivity in my designs.

  • Expand Design Horizons

    Stepping out of my comfort zone, I ventured beyond my usual realm of mobile application design. Venturing into the realm of website design, I sought to elevate my capabilities to new heights.