Coding the Site
Because the site needed to go live sooner that expected, I decided to skip a step. I had intended to spend some time in Figma working on a layout, but I felt I could take the wireframes I had done, and build the site in Bootstrap right away. The site is online currently if you want to look at it yourself.
I started by developing a quick template, with a colour palette and fonts I wanted to use: Lato for body copy, and Roboto for headings and photo cutlines.
I decided to make the header on the home page summarize what the company was all about. I worked out the "Clean renewable energy" copy with the stakeholder, and combined it with a natural vista. The icons and text, serve as a bullet point summary of the technology. My goal is to direct the users, whether users or decision makers to the technology or applications pages. Also, because this isn't something where prices of the product can be listed online, I put a call to action on this page to encourage potential customers to contact the company for more information.
This was always going to be the most detailed page. Again, I used bullet point icons to summarize the most important aspects of the tech and pair it with the visual mnemonic of the icon. The icon size shifts for a mobile device to take up less space.
The other pages of the site are less detailed in terms of content, but followed the same design principles as the other pages. I strive for consistency and simplicity.