People + Places:
accessible creative directory
OPPORTUNITY
How to deliver an accessible web directory detailing networks and resources for creative practice?
SOLUTION
A responsive web-based resource.
Focused on user-friendly navigation, intuitive information architecture and clean aesthetics, compliant up to WCAG 2.2 level AA.
Timeline
4 weeks
Project
Resource to be presented as part of a talk at V&A Upstart festival
Client
Maia Ardalla
Scope
UX/UI Design, front-end development, accessibility compliance
4 weeks
Project
Resource to be presented as part of a talk at V&A Upstart festival
Client
Maia Ardalla
Scope
UX/UI Design, front-end development, accessibility compliance
Informed by public practice
When Maia approached me to design and build this resource as part of her talk at V&A Upstart Festival of Creativity, the following requirements were discussed. These were informed by her experience and insights with young people who were seeking advice and resources for creative practice.
- Accessibility: Ensure the directory was usable by the widest possible audience, aligned with public programming values
- Effortless maintenance: a critical need for a living document that would be frequently updated with minimal technical overhead
- Mobile optimisation: recognising that mobile-first approaches reflect the reality of creative practice
- Contemporary visuals: Clean, engaging aesthetics
Given the tight timeline, my role as the sole designer and builder, and the limited budget, I strategically chose Cargo as the development platform. My prior extensive experience with Cargo meant I could rapidly build the site while maximising the financial and maintenance budget, allowing me to focus more deeply on fulfilling the specific design and accessibility requirements.
ACCESSIBILITY
Strategic target setting towards best possible international accessibility standards
I targeted for WCAG level AA during the planning and design stage, although adjustments had to be made once development started.
During development, I also utilised assistive technologies to preview the website to ensure it worked appropriately. Colour schemes and fonts were continually tested during brand development for maximum contrast. The final colour palette meets level AAA for visual contrast, which represents the highest level of success for visual contrast.
Mobile-first approach, validated by continuous testing
The website is designed with responsive layouts; in Cargo, I am able to switch regularly between mobile and desktop previews to ensure that changes I am making are consistent and responsive.
The focus of vertical flow for mobile optimisation is also ideal for accessibility, both for desktop and mobile users. On mobile, the menu is placed as a button on the lower right corner with padding in consideration of user thumb placements. As an android user, I asked friends with iPhones to preview the site to ensure that it was usable across different devices.
Solid foundations for future expansion and continuous revision
- Due to tech stack, there are still violations present on the site that stop it from being AA compliant. I plan on consulting other experts for ways to streamline and improve this in the future along with future updates.
- However, as the foundation for accessibility is solid, these issues are not issues that affect usability of the site, ensuring that the site is still a high quality, accessible resource for all in its current and future iterations