Mercia Marine Website Project Share: Ballyhoo Score Awaiting client review n/a Date Published 2 December 2022 Reading Time 6-Minute Read Creating an engaging website that allows users to get boat insurance quotes online, with a user portal functionality. Project Overview Mercia Marine had an outdated website that was in need of an overhaul to bring it into the modern world. We created an easy-to-use and attractive WordPress website, allowing users to make an informed choice and start a quote, log in and renew their boat insurance online. Who is Mercia Marine? Mercia Marine specialises in providing boat insurance, marine business insurance and marine trade insurance to the marine leisure sector. Their high-quality customer service allows them to build long-term loyalty amongst customers, by providing a personal touch. Project Brief The website needed a modern refresh, ensuring that the layout made the content easily digestible and accessible, with clear sections for users to read through at their own pace. The website also needed to retain its current search engine rankings, and continue to be SEO-friendly. The overall aim of the website is to encourage users to take action in the form of starting an insurance quote journey or logging into their current account to view documents, renew their insurance or submit a claim. Our Proposal The aim whilst designing the website focused on encouraging the user to get started on the insurance quote journey or, as an existing customer, to be able to quickly make a claim or view their policy documents. Other pages on the website are secondary to these primary goals, such as providing further information to help the user start a quote. Due to the client needing to maintain their current SEO rankings, we used similar content from their old website and retained important keywords. The site and URL structure was also mirrored as much as possible while still making the site easier to navigate. Look & Feel During the design process, we identified that the website should be colourful and synonymous with boating and the sea, which led us to incorporate an ocean theme throughout the site using both the green and blue of the logo. The primary Curious Blue shade has been used liberally, working well for the marine theme and also the connotations of trust and reliability. Green and black are very high contrast so they have been reserved mainly for text and buttons. Gradients incorporating tints of Watercourse Green along with the Elf Green shade have been used for variation and for the effect that water very much changes shade depending on location and light conditions. A wave motif has been used to help create separation between sections and add a visual of the nature of the industry along with high-quality, aspirational marine imagery. Branding Mercia Marine had an existing logo that the company wanted to keep. We, therefore, formalised their visual identity using a brand guidelines document, communicating how the brand should be represented to the world. This branding – including logo and colours – is used throughout the website to achieve consistency and create an immersive brand experience Mercia Marine now has a reference document that they can use internally or provide to designers on future projects. It details how and where to use variations of their logo, as well as their visual tone of voice and which colour codes and fonts to use. The Technical Details Web Development We’ve implemented a mega menu, accessed via a ‘burger’ icon, allowing users to access the main pages of the website. This opens across the full screen giving us space to include important ‘quick links’ as well as the main pages, search function and contact details. Making use of a hidden menu allows the site to appear cleaner and gives more prominence to important links (renew online, make a claim etc.) as well as our main call to action to start a quote. On the home page, we’ve featured a large ‘hero’ intro and image that focuses the user to perform one of two actions: ‘Join the Crew’, highlighting USPs and inviting users to start a quote. Explore the types of insurance Mercia Marine offers by clicking ‘Boat Insurance’. We’ve also included a testimonial section with a selection of hand-picked reviews that best highlight the company’s strengths. CTAs ‘Start a Quote’ CTAs are included regularly so users don’t have to scroll to start the process. They are attractive and engaging – using pops of colour to draw the users attention to encourage them to take action. Footer The footer section fills a large portion of the screen in order to include quick links and documents such as the privacy policy. This is also home to important contact details, allowing customers to contact Mercia Marine easily and quickly. Motion Motion is an important part of web design, and makes the user experience interactive. We have animated ‘boat type’ text which cycles through the types of vessels they insure, which is both engaging and offers a space-saving way to quickly show users the range of what they do. We have also included animated waves in the home page web design, offering a fun and interesting way to separate sections, allowing us to add background colours to draw attention to sections on the page. We also added a really fun feature – on mobile you can tap the waves to get a dolphin to jump and appear! Feature Summary Information Architecture The previous Mercia Marine website held a large amount of content – including pages and articles. This content was collected and culled to ensure that the new website consisted of only relevant and up-to-date information. The content and pages were then mapped out to ensure an easy-to-use navigation system was in place, with internal links inserted around the site for SEO purposes and user experience. Integrations Mercia Marine uses a third-party insurance quoting platform that allows users to get a quote quickly and easily. Website CTA buttons direct users to this platform, which uses the Mercia Marine branding and looks consistent with the website. CTAs open in a new browser tab, allowing users to refer back to the original website for ease. Support & Maintenance Due to the critical nature of insurance, Mercia Marine has taken advantage of our Service Level Agreement which gives them access to our expert support and troubleshooting within guaranteed timeframes – ensuring that they stay online and in front of their audience 24/7. How Can We Help? If you are in need of a new website, a refresh for your existing website, or anything related to websites and the Internet in general then feel free to get in touch. Any member of the Ballyhoo team will be happy to help and can be contacted by telephone on 0121 295 5352, email to hello@ballyhoo.co.uk or via the contact form below.