The Aging and Disability Resource Center of Ozaukee County promotes choice, independence, and well-being through personalized education, advocacy, and access to services and support.
The Aging and Disability Resource Center of Ozaukee County promotes choice, independence, and well-being through personalized education, advocacy, and access to services and support.
Despite the increase in technology acceptance and integration into daily life, seniors face temporary and permanent challenges that can prevent them from using technology to their greatest advantage:
It is more important than ever for designers to create and maintain environments that are logical, intuitive, and accessible!
Manual inspection of the original site uncovered:
WAVE,NVDA, AXE Dev Extension uncovered:
Initial rough sketches illustrated the problems, ideas, and emotions behind the user concerns and pain points uncovered during research.
Later sketches explored more concrete aspects of use of space, addition of interactional elements and links, and potential navigation options that were more meaningful and intuitive.
Wireframing Initial wireframes explored options for expanded layout and a contained a visual, grid navigational structure for the home page. I imagined meaningful, illustrated or photographic links and expandable menus to provide concrete areas of focus
Later sketches explored more concrete aspects of use of space, addition of interactional elements and links, and potential Expandable menu options for subtopics were considered in situations where meaningful images were not suitable or in cases of more extensive topical information. This approach helped to create distinct, selectable areas, reducing information overload and establishing defined areas of information and associated links.
Task journeys on aging resource sites often begin during times of stress and necessity. My goal was to create a warm, welcoming, and empathetic environment to significantly enhance the psychological aspect of the user experience.
Initially, I envisioned a card featuring a category titles and meaningful images. This evolved into a vintage polaroid concept to evoke pleasant emotions. When the design competed with the background, I refined it to a clean, modern design that enhanced the photographic concept and balanced the emotional aspect with the design element on the page..
To keep accessibility and senior design in focus, I carefully considered various affordances and signifiers. Elements such as raised appearance, hover state effects including category underlines were incorporated to provide clear, multifaceted cues for an active state.
I felt the colors in the prototype needed to provide necessary contrast, reduce the harshness of oversaturated hues, maintain and direct focus, and create a calming environment. A tall order!
A palette of dark blues, grays, and whites with a soft gradient was incorporated to reduce visual harshness. Photos were selected for their caring and supportive theme with consideration for light and nature elements when possible. These photos were slightly desaturated to ensure uniformity in the stock photography variances.
To ensure accessible contrast, the placement and position of gradients and overlays with respect to text was carefully considered. The resulting color layers were sampled and assessed using the WAVE tool to maintain good contrast while preserving a soft effect.
Where initially placed as a sidebar, it took up too much usable space and crowded the interface. Alternative block placement in subsequent iterations near the header provided the ability to be more consistent but reduced focus and posed some confusion when programmatic contacts differed.
A landing page was designed to feature a distinct area for a valued mission statement and local contact information. These elements could be prominently linked on any page header without occupying valuable page real estate. Color, size, and underline were used to eliminate color dependence while providing strong identification in the hover state.
Maintaining a separate landing page allows the organization to prioritize its mission and contact information. This approach ensures that resource and subsequent pages remain focused on resources and programs without occupying valuable space or causing excessive scrolling.
Continuing the use of a grid structure for main categories provides a clean and intuitive format. Further exploration of high-value category organization versus alphabetical organization can be considered.
Adding distinct sections for volunteering, donations, featured topics, and events provides clear definition and minimizes complicated navigation. This also highlights areas of interest that were previously hidden.
Heuristic evaluation revealed inconsistency of contact placement information as well as disrupting visual flow patterns. As the organization clearly valued easy and frequent access to this information, I needed to find a better way to honor that structure without compromising design.
Submenus with extensive resource information are housed in accordion-style menus. This design allows users to easily locate and view only the necessary information, reducing overwhelm, and maintaining focus.
Websites designed for seniors don’t necessarily meet their unique needs. I focused on the redesign of this site with careful attention to senior-focused requirements, accessibility needs, and user empathy.
The design goal was to create an environment to reduce:
As well as to improve:
Initial testing indicates this was accomplished though improved use of space, the visual grid structure, logical navigation path, focused expandable topics, logical link placement, and a more accessible hierarchy.
The use of color, style, contrast and focused/hover-state effects provides strong visual guidance for seniors as well as all users. This approach enhances attention to associated links and calls to action, helping to intuitively guide users on their task journey in a welcoming and calming environment.
I am looking forward to more summative testing to provide additional insight on refinement and additional opportunities.