Blue Sky Tree Service and Preservation
For Brown University CSCI 1300
Summary
A website redeisgn for Blue Sky Tree Service and Preservation.
Technologies
- HTML
- CSS
A website redeisgn for Blue Sky Tree Service and Preservation.
Analysis
& Stakeholder Interviews
Investigation uncovered a myriad of issues with the standing webpage. Logos were not properly displaying, links were broken (including those to social media sites), and text was often hard to read—a result of poor color contrast, low font weight, or busy background images. The testimonials page was empty.
Stakeholders described frustration with the lack of relevant information on the site and a confusing layout that made accomplishing tasks difficult. Company employees also expressed concern with the website’s content and visuals: “It looks bad and it’s hard to use,” was the common complaint. They also reported the contact form caused the company email inbox to be inundated with spam. The office manager requested the ability to modify the site on occasion—including days/hours of operation and the image gallery.
The WAVE accessibility score of the site was far below acceptable. Besides text being difficult to read, the layout hierarchy was unclear, image alt texts were missing, and ARIA labels were scarce and vague.
Notice poor color contrast, small text, impersonal stock images, and a "site powered by" line.
View the full website at https://blueskytreesvc.com/
Visual Redesign
The redesign process started with a variety of Low-Fidelity sketches. The best of these designs graduated to a High-Fidelity prototype. Care was given to ensure the site could display appropriately on all devices. A style guide helped keep visual elements consistent.
Low-Fi
Web
Mobile
Tablet
High-Fi
Web
Mobile
High-fi prototypes saw refined visuals, content, and flow. Executives' concern for a high elderly user base motivated a simple display with large fonts.
Tablet
The Final Product
Take a look at the new, improved design!
https://blueskytreesvc.pages.dev/