For this week’s lecture, we used a code-free platform called Framer to create our websites. This resembles Figma as you insert the text, images, and shapes. I used a plugin that converted the Figma design to HTML for the framer to read. All I had to do after this was to add the framer version onto different sizes of screens. I used the Woman in Design version to experiment with this platform.
When using the Framer I was able to have the design exactly the way I wanted the website to look and work. Still, I found it a bit more difficult to get the images and the text on the smaller screens where as the HTML version does this automatically to suit the size of the screen.
I prefer to use HTML and CSS to create websites as they have a more professional look. I could not figure out why the text was disappearing when the screen size was increased. Also figuring out how to use the navigation tool was harder than HTML as it was difficult to link the text to a specific part of the page. for this design, I could not figure out how to use the navigation feature on Framer as the links for the headings would not show the areas of the page but if this was to be published I would have the navigation links working.
We also looked at different no-code website builders including Squarespace, Wix and web flow. I decided to explore some of these other options as it was hard to work framer. I thought that Wix was easier than Framer as was easier to navigate around.
Below is the Wix website that I created using the ready-made sections that Wix provides, Wix has an image bank and Unsplash built into the platform which makes it easier than finding the images online and putting them in it also makes sure that the images are free to use.
Screen Recording 2024-01-03 at 22.35.31.mov
<aside> 💡 For the final lecture week, we explored the use of non-code platforms but I found this harder to tag HTML as it was hard to navigate around the breakpoints and the grids. We used Framer to create a website but after some of the fine details I produced a website. I thought that the main design of the website was similar to Figma but it was the breakouts that were the hardest to figure out. I would like to learn how to link the navigation bar to parts of the pages. I liked learning how to use plugins especially the Figma to framer plugin as it slowed me to copy my design exactly the way I wanted over to framer. I would also like to explore other types of non-code platforms such as mix further.
</aside>