Melendez Tree Services

A Point of Perspective

An owner of a small business wanted to revamp his website as it was out of date and not user friendly. The designs to that website were created without any interest in the user or the thoughts of the client. The entire page consisted heavy text for a service that does not require such extensive explanation. In order to get the best perspectives of an arborist, I asked if I could join his team for a few days as a helper to get an insight into his clients and work ethic through manual labor. This hands-on approach allowed to speak to the users directly.

The Trial

The test of ingenuity needed to be answered with a complete overhaul of the site. This new site was to exist as a separate entity from outdated site. Taking into account the user base, I needed to create a solution that gave to understanding that this was not a new business, just a new experience. The new experience would motivate anyone into requesting their services, and learning briefly about what the company does without overwhelming the user.

Former home page
Former home page

This home page is an example of strange color choices that aren't pleasing to the eye as well as the image placements, typography and overall responsiveness on both mobile and desktop platforms.

press to zoom
Services tab
Services tab

Throughout our travels in the web, text heavy equals more time reading. No one has time for that when all you want is speedy service.

press to zoom
Service tab 2
Service tab 2

The focus of the scope for this site was given to the landscaping service with lengthy explanations and little visuals.

press to zoom
Tree service tab
Tree service tab

This is the primary service that this company provides. In this site it was given little importance, something that needed to remedied.

press to zoom
services tab 4
services tab 4

The other services that are offered are incorrectly grouped as we can see. Landscaping and mowing should go together.

press to zoom
Contact page
Contact page

Attention to detail is carefully discarded in this form where consistency and balance is non-existing. Also, there is a fake captcha check.

press to zoom
The Responsibility

My function as the Lead UX Designer meant that I was conducting all manners of the UX process to ensure that the client was getting a product that demonstrated the worth of his skills as an arborist, without confusing potential new clients. This meant that all iterations were to be tested, researched and then tested again to ensure high caliber work as well as usability, user effectiveness, and overall feel.

The Process

Extensive research went into locating the direct competitors as well as potential competitors. This lead to a proper competitive analysis. While considering the data, a rough idea was iterated taking into account key ideas that were requested from the client such as: a sense of openness  the color scheme, and a easy to use and understand layout. As ideas flowed the first iteration began to to take form. Testing began following the first iteration. Results of the first iteration were mixed as expected but with valuable information to consider. Things were pointed out specifically as: the look was not easily understood, or the layout design was confusing as to what services was being offered. The indicated was taken into consideration and retested which resulted in iterations 4-7. 

Sketch drawn out with notes
Sketch drawn out with notes

Quick sketch with a few ideas from the client along with a iteration 1-2

press to zoom
Melendez Iteration 3
Melendez Iteration 3

A brief iteration incorporating design cues from the actual site.

press to zoom
Melendez Iteration 4
Melendez Iteration 4

More research led to the color combination as well as the header.

press to zoom
Melendez Iteration 5
Melendez Iteration 5

Reorganization of the items in the site has occurred to facilitate navigation.

press to zoom
Melendez Iteration6
Melendez Iteration6

All items on the site have been reconfigured after testing, this iteration showing the greatest ease of understanding.

press to zoom
High fidelity mockup
High fidelity mockup

After testing was completed, it was clear that this iteration was the design to use. However, a few tweaks were necessary to polish the design.

press to zoom
Solution

The creative answer to the problem of usability issues, misplaced services, and lack of coordination was answered with competitive analysis and testing. Testing made the scope clear, and reiterating made the design sharper and more user friendly in multiple platforms. The overall product was one that had the client ecstatic as well as his users. The experience of working directly with tree trimmers is one experience that truly gave me a greater insight into the creative process, testing, and research. The entire process of researching,  interviewing, testing,  iterating, was completed in absence of a team. The result of many hours of careful thought and creation are in the live site. 

Home Page Final
Home Page Final

The final iteration that made it to the creation of the site.

press to zoom