Reflection

Design strategy: I was very inspired by a london based magazine called Material Grrrlz, so I wanted to create a mock article for their magazine and included a theme appropriate crochet pattern. For the homepage, I wanted it to have many different elements because much of their magazine and community is through the internet, so this is kind of their home base. I put the magazine volumes first then highlighted crochet patterns and finally community resources. My users are hopefully people (probably women and girls) who are enjoy fiber arts and feminism.

Typefaces: I have two major type faces in this web design. The first one is Knewave, which is a messy bubble letter type face. I think this typeface represents the craftiness and fun of the concept. This type was used for headings mostly, because it all starts to look the same if it is in a paragraph. I think it looks great as a large or short header. The second main typeface I used was Calistoga which is a heavy weight script font that almost looks like it has a serif. It is classic with a small flair, and easily readable in larger paragraphs. This type makes up the majority of my webspace. I also included an instance of a third font, that looks like letters on keycaps, this is used for the footer which lists the website and the Instagram.

Interactions: The interactions and micro interactions were very interesting to learn. I was exploring the components and variables in figma so I made one that is a drawing that is rasterized and can now be clicked on, which is a really fun element. I created many components for the website including: a home button, article buttons, and pattern buttons. I also included a hover interaction with the infographic where when your mouse hovers over the pie chart the percentages of the statistic appear next to the little information tag. There is also a scrolling text effect which showcases the theme of the next issue of the magazine.

Medium: The biggest changes I made to the design was making it easily readable, but still detailed. I tried to acoomplish this by heavily spacing the text and the images/interactions. Without this I think it would have looked much more compacted and look too cramped for a website. I also was able to expand on this project with the versatility of the component’s and easier movement of icons. That also made it more time consuming to assemble, but once I understood how figma worked, it was more interesting. I explored some of the add-ons that figma offers as well as the community posts which have a lot of valuable information.

Self Eval: I think that I did well on this project, maybe mid nineties, especially with the more niche style that I was trying to emulate. I think my components are very good as well, and I explored different triggers and variable combinations. I think my website page is also clear but eclectic with little details and color pops. I was able to be more creative with this color palette and article web design. I have only made portfolio websites and blog websites before, so this kind of website is a lot less personal.

Growth: One thing that I learned about design from doing this project is that visual flow is a lot more difficult when it includes multiple page designs which much be coordinated without being exact copies. This also connects to my take away was that editing is a huge portion of the work, a lot of my editing consisted of making adjustments, wanting to re-do it, and using control + z. With this I was able to look at a lot of different versions of the website and make adjustments especially when using the columns and grid functions.