ryan garrett.


  • resume.
  • contact.
  • Angel Studios - WORKING

hylas yachts



ux /ui design | branding | graphic design



proposal





challenge.



How can we create a brand that evades trust and tells our history as a custom yacht builder and helps share our love of the ocean?



key objective.



With a rebrand, new website, and new yacht club, Hylas wanted for new and old customers to be excited for the new yachts that are coming out and help new customer discover the quality and history of Hylas Yachts.



solution.



Refresh and create an all new experience for Hylas Yacht owners. Research in the history and talking with stakeholders was key for the success of the rebrand and helping to create the new user experience.



design process





01



research.



the systematic investigation into and study of materials and sources in order to establish facts and reach new conclusions.



02



prototype.



a first, typical or preliminary model of something, especially a machine, from which other forms are developed or copied.



03



design.



a plan or drawing produced to show the look and function or workings of a building, garment, or other object before it is built or made.



04



launch.



start or set in motion, set a boat in motion by pushing it or allowing it to roll into the water.



01 research.





user flow / interviews / user personas



This was a whole new experience for me since I have new been actually been on a yacht before, this was an awesome way for me to understand the world of yachts. I talked weekly with the stakeholder to understand their point of view and vision for the rebrand of the sailboat line and power boat line they were about to launch. I also had the opportunity to meet the stakeholders and the whole team and a weekend long boat show. I was able to interview and meet many people to who have been around boats and yachts all their lives. It was a great experience to learn the passion everyone has for the ocean.


All of those meetings and interviews helped me create the user flow and user personas for their customers and help us all understand how we can create a great experience. This also helped inspired me when creating the new logos for the product lines of sail and power yachts. Is phase was key to work closely with the stakeholders and make sure I was hitting all their pain points and make sure we were always on the same page.



02 Prototype.





wireframes / user testing



In this phase of the project gathering all the information I had learned and talked with the stakeholders I was able to start to create wireframes for the new website. Using the user journey map I was able to design the new site map. Since these boats were all custom made it was important to show what features the boats had and how they could be customized. After creating the wireframe I was able to interview and test the ux and see how other were able to interact with the site. This was great to make changes and make an overall good experience. Another huge importance for Hylas was to tell their story and history of the company, a huge part of that was to tell me meaning of Hylas "Spirit of the water".



03 Design.





ui design / branding / graphic design



Taking everything we learned from the tests and talking with stakeholders. I started to combine the colors and branding elements I designed to the design. Here you are able to see everything come to life. Here are some examples of the homepage and a yacht page.



04 Launch.





branding / yacht club



Here you can see some of the branding elements created for Hylas Yachts. You can see the Hylas Sailboat logo was inspired by the H in their logo and the sail. I wasted to create a simple and modern logo that had movement and flow of a sail. The Hylas Powerboat logo was inspired of the boat cutting through the waves, showing the power of going threw the ocean. We had such a great launch with the website and new branding that I also had the opportunity to help launch Hylas's first club, designing the flag and the website as well.



more projects.


traeger provisions
little giant
bella lash

email me.