New website design & build for HHI
Background:
HHI has become the leading Home Improvement Company in Northern Ireland, expanding its presence to five branches across the province. Their commitment to excellence has established a network to make innovative products and services accessible to a broad audience.
Project Brief: As part of their growth strategy, HHI aims to enhance its online presence through a comprehensive project. The key objectives are as follows:
Craft a New Site Architecture:
Objective: Reimagine the website to improve user experience.
Focus: Make navigation intuitive for visitors, ensuring easy access to desired information.
New Design with Brand Style:
Objective: Create a new design that reflects the refreshed brand style.
Focus: Develop a visually appealing design that embodies innovation and quality, aligning with HHI’s brand identity.
Showcase the Product Portfolio:
Objective: Utilize the new website as a platform to showcase HHI’s extensive product range.
Focus: Accurately represent the diversity and quality of their offerings to visitors.
This project underscores HHI’s commitment to staying at the forefront of their industry by leveraging an improved online platform to engage and serve their audience effectively www.hhi-ni.com.
Stage 1: UX Wireframing and site architecture - Low Fidelity
In this initial phase, low-fidelity wireframe prototypes were created to establish the foundation for the website’s architecture and navigation. The focus was on making the site user-friendly and ensuring easy navigation for visitors. The wireframes included plans for the overall site structure, homepage design style, and the layout of the header and footer.
Stage 2: UI Wireframing and Site Architecture - High Fidelity
Moving forward, the chosen creative direction was developed further in high-fidelity wireframes. These wireframes featured actual image and text assets, providing a more detailed representation of the design. Feedback was sought and incorporated into the refinement process during this stage.
Stage 3: The Prototyping
A high-fidelity prototype was created from the wireframes to showcase the design and animation of elements. This prototype closely resembled the final website, incorporating brand style, navigational buttons, and a comprehensive showcase of HHI’s product portfolio. This step was crucial in providing the client with a clear visualization of the website’s appearance across various devices.
Stage 4: The Build
After the client approval of the fully functional prototype, the actual build of the website commenced. The focus was on accurately translating the prototype design into the live website. Extensive testing was carried out across multiple devices to ensure responsiveness, ensuring a seamless transition from desktop to mobile and tablet.
The final result of this process is the new HHI website, which can be accessed at www.hhi-ni.com. This website is expected to serve as a platform that not only reflects HHI’s refreshed brand style but also effectively showcases the diversity and quality of its product offerings.
