In January 2021, Ross approached me in need of a webpage for his campaign for a position in the University of Southampton Student Union. His requirement was a fast, optimized and SEO-friendly page to highlight the key points in his manifesto - I was more than happy help & undertake the project.
Prototype & Design
As with any front-end project, we began by producing a design prototype in Figma, a brilliant tool for design and wireframing (similar to Adobe Illustrator at a glance)
The design goals were that the site should be lighthearted, breathable and to-the-point. For these reasons, I suggested we use lots of bright colours and bold type - Ross was also interested in having very few "hard" edges, and thus we opted for a number of "wave" elements to act as dividers between some of the key sections.
As for fonts, we opted for Montserrat and Roboto (from Google Fonts) for the headings and body sections respectively.
With a mostly complete prototype, I began work on building the site itself. To achieve this within the tight timeframe we had, I chose to use NextJS & TailwindCSS so that I could take advantage of the tooling provided by React and the utility-first approach of TailwindCSS.
This meant that it was extremely easy to create "template" elements that could be reused with different data. For example, each of the manifesto points are actually just one simple component takes a title, number and body argument. For the sake of simplicity, all of the data is simply pulled from a local file - this removed the need to worry about a content management system.
SEO & Deployment