Before starting on the code, I put the text extracts into Figma and designed what the webpage should look like. I chose a golden colour as the websites primary colour as the text often mentions golden pears, sunlight and sunflowers- so I thought this colour would help give the right ambiance.
.png)
For these figma mock-ups I used the Bentham typeface for the body text and Bentoga Italic for the headings. I chose these typefaces as, to me, they fit the look of a novel and makes the website look more fit for purpose.
I chose each of these images to suit extracts of the text. I chose my opening image based on the extract “sweet melting pulp of golden pears” from the first blockquote. The next image is supposed to reflect the paragraph about “The Market Square”. The last image is directly inspired by the extract in the last paragraph, “An enormous sunflower, lifted on a powerful stem and suffering from hypertrophy, clad in the yellow mourning of the last sorrowful days of its life…”. All of these images were sourced from Unsplash.
Framer is a no-code programme for building websites. Framer is unique as you can directly take designs from Figma and convert them to code in framer. I struggled with adjusting the website so it would be suitable for different screen widths. For this reason I decided to stick with Github and HTML for my final product.
Pictured here to the right is my tablet / mobile view of my website, made on framer.
https://modern-badge-219393.framer.app/