Vantage CFO

The Client

Paula Lister CGMA was referred to me through one of my existing clients. She was establishing a new Finance Consultancy practice and wanted a one-page website that clearly presented her focus areas and brand.

The Brief

The goals of the website were succinct: a one-page website, clear sections, icons or text boxes to break up content, photos aligned with text. SEO was also a consideration. She provided the initial content in a Google document, which was later refined during the course of the project to improve clarity and conversion.

Planning

Once I had the brief, I worked out a plan for the structure of the website and walked Paula through my proposed approach. We discussed her goals, the intended audience, and UX considerations, including how visitors would navigate the different sections and the best way to present her services. We also considered how the text could tell a clear story while supporting conversions.

Design Foundations

After mapping out the homepage in wireframing, I then started working in Figma, creating the groundwork for the design style of the site. This included colour choices, typography, font sizing, and button styles. I made sure not to deviate from Paula's logo and brand colours, selecting a font style that complemented the identity. I considered foundational elements as the "atoms" of the UI, providing consistency across the design.

High-Definition Mockups

With the foundations set, I began work on high-definition mockups of the homepage in Figma. I started with the header and footer, placing the hero section text first and experimenting with layout options to find the best balance between headings, imagery, and calls to action from a UX/UI perspective.

Once Paula approved the hero section, I moved through each homepage section in Figma, refining layouts, positioning icons, and ensuring photos complemented the text. This iterative process continued until every section felt visually cohesive, structurally clear, and aligned with Paula's brand tone.

Development

After all Figma designs were approved, I began development on a private WordPress staging environment, accessible only to Paula and myself. The build mirrored the Figma mockups closely: global styles such as colours, typography, and buttons were implemented first, followed by responsive container widths and repeatable sections for the homepage.

I constructed the site from smaller components outwards, ensuring consistency across sections. Menus, header, footer, and buttons were built and tested for responsive sizing. Icons were rebuilt in SVG format for crisp rendering on all screens, and imagery was optimised for performance without compromising quality.

Finishing Touches

With the site fully built, I conducted final testing across different devices and browsers, checked responsiveness, and ensured accessibility standards were met. Once everything was signed off, the site was moved to the live domain.

The Final Result

Paula now has a clean, confident one-page website that reflects her brand and communicates her services clearly. The site is fully responsive, visually cohesive, and built with scalability in mind to allow for future expansion.

Need help with your website design and development? Looking to create a professional online presence for your business? Then get in touch and we can discuss your project requirements.