WHO - WHAT - WHY
I created an updated website for Evergreen Landscape Inc. The company wanted a refreshed site that felt comparable to their competetors, was modernized and had a page layout that had improved layout and navigation.
PROJECT OVERVIEW
CHALLENGE
An established Landscaping company needed a website refresh that looks up to date and clean, attracts new customers and gives customers information on available services.
​
SOLUTION
Design a new website that is has a clear layout and cleaner menu with additional pages to show clear delineation of services and about pages.
​
GOALS
-
Improve Visual Design
-
Improve website flow
-
Add testimonial page
-
Simple & Informative
-
Intuitive layout and navigation
-
Improve store page, partners page, link to socials
ROLE
UX / UI Designer
​
TIME
3 months
​
TASK
Improved website design
​
TOOLS
Wix, Photoshop, Illustrator, Figma
MY PROCESS
RESEARCH > DEFINE > DESIGN > TEST > REDESIGN > PROTOTYPE
RESEARCH
CLIENT INTERVIEW
-
Target Audience:​
-
High-end residential (ex. Atlantic Beach, NY)
-
Customers of the Supply Store (smaller local landscape companies purchasing material)
-
Commercial Properties & General Contractors (ex. Hunter Roberts, Whiting-Turner, EW Howell, Consigli Construction)
-
​
-
Desired Website Updates:​
-
Better website flow overall
-
Logo for the store supply page/portion of business
-
More professional and modernized UI - updated logo
-
Add a testimonials and reviews page to build client trust
-
Add partners page and clickable partner links to about page on their website​
-
Improve the store page - improve supplies and pricing, possible pick up order feature
-
Streamlined Footer - Contact page at the bottom of every page to direct customers to get a quote
-
​
MANSCAPING
THE LANDTEK GROUP INC.
PACIFIC LANDSCAPING INC
COMPETITIVE ANALYSIS​
The client gave me two companies they wanted their improved website to mirror, and I researched additional companies that are popular in the Seattle area. I looked for commonalities across the sites to see what kind of layouts are popular among similar landscaping companies.
​
​​
OPPORTUNITY FOR IMPROVEMENT
Most landscaping companies highlight 6 main sections: Home, Services, Past projects, About, Social media, Contact pages. The current website had three main menu sections. The website would benefit from more pages with additional tabs along the menu so customers can quickly find and navigate to the desired information. Clearer photo galleries and a surplus of hero images are key in conveying legitimacy to the customers of the sites. Adding a testimonials page, partners page with clickable links as desired will also help in building trust with users. An improved contact form on every page will direct users to contact the business and get in touch more fluidly for a quote and increased business.
DEFINE
SITEMAP
I put all of the existing elemets that the website already had and added a few additional needed elements onto paper to physically rework the flow of the sitemap. This really helped me consider how to best group the elements for the user. The websites used for inspiration had more pages individually listed across their main menu and I believe this makes it easy for the customer to find exactly what they want on the website, so I put seven sections with some elements nested within the pages that were intuitvely related.
​
DESIGN
SKETCH
I drew an image for the main page and what it would look like. A scrolling screen with a large hero image would be the most intuitive and enticing to the customer, with a clear menu across the top that leads customers straight to the information they might seek.
PAGE DESIGNS
HOME
I designed a scrolling home page with large images of their work inluded and services listed so the customer could get a fast idea of what the company could provide at first glance.
SERVICES
The services page lists cleanly and concisely the company's available services so the user could quickly find what service they are looking for.
ABOUT
The about page gives the company's mission statments and introduces the team members so the user can gain trust in the company, understand what they stand for and get to know the people that might be in and around their home.
CONTACT
A contact button is included at the bottom of every page and is given it's own section in the header menu so the user is brought repeatedly to get in contact with the company. The company gets increased interaction and the channel of communication is easily found for the customer to get their questions answered by real people.
TEST
USEABILITY TESTING
I tested the website with three users who were in the market for updating their landscaping. The user feedback indicated that users were able to easily navigate the website. Users wished there were more photos and larger photos, and also suggested a seperate page just for a photo gallery of example work. They also said they looked forward for more testimonials to show credibility and that could be added as the company grew.
​
CONTINUED DESIGNS
.
PAGES
Compiling all the information I had worked on thus far I worked on creating a polished and fully actualized web design that I could hand off to my client, and they could easily add photos and testimonials as they improved their business and gained more and more clientle.
PROJECTS & TESTIMONIALS
I added a past projects and testimonials section to further establish credibility.
PHOTOS
A scrolling gallery of photos gave the user clear images of their work and ideas of what they might want for their own home or business.
LOGO​
I created an updated logo for the central header of the website that would mirror their other forms of branding. The logo was designed to clearly convey the company name and the landscaping element their work is rooted in. I was also asked to create a logo for their store. The landscape supply logo is a welcoming and sweet image of their storefront, a barn that houses soil and other tools.
BRAND DESIGN
I chose colors for the brand that I had seen repeatedly while researching landscaping. The natural colors reflect lawns and yards and also exhibited a stylish and sophisticated tone that would give a sense of authority and trust. I chose a sans serif font for the headers so the user could easily and clearly read the text. A modern serif text was chosen to make it easy for the user to read the smaller text and give an upscale feel.
.jpg)
FONT UPDATE ​
NEXT STEPS​
1. RE-TEST - I could work with more users to test and make sure the flow was intuitive for them. The 3 users I worked with felt the flow was clean and clear, but most testers were in their 30's and I could work with users of a larger age range to ensure usability is clear for people of all ages.
​
2. HAND-OFF - When the design was finalized and my client was happy with the set up, I handed it off to them. The intention was to get a functioning webpage going for them that they could easily update as their business progressed, which is another reason it needed to be simple and streamlined.
​
3. ADD FEATURES - I have suggested to them that they add at least ten testimonails to their page, add team member bios with photos and continue to add as many example photos of their work as possible as they progress.