We started the ideation process with a conversation to get on the same page in terms needs and wants. Luckily the client already have a somewhat clear vision of what the website should look like which made my job easier; the website would take inspiration from the website of modern art museum with minimalistic black and white style to it.

The client took an active role in the design process which made the design process easier as we could work on the same Adobe XD workspace and the client could make modifications if needed and vice versa. Overall the design phase the Website was a cooperative effort.

Around half of internets users use a smartphone for browsing the internet which make the website responsiveness for smaller screen sizes of utmost importance. Webflow has for different screen size breakpoints by default and more can be added through custom media queries which makes creating responsive website straightforward.

The desktop version's navigation bar is a traditional header with text links. From 991 pixel screen width down, navigation is done using a hamburger menu that open menu drawer from the right. It is much easier for to click the with the thumb if the drawer appears from the right. Unless you are left-handed but according to Google left-handed people make only about 10% of people worldwide.

The desktop responsiveness is taken care of by using percentages, EM units and max width properties to have a uniform design across different desktop screen widths. Responsiveness for smaller screen widths can be easily achieved through Webflow four breakpoints: desktop, tablet, mobile landscape and mobile. The CSS on desktop cascade down to tablet and mobile breakpoints but CSS on mobile doesn't affect tablet or mobile landscape.

The website has a blog, so having content management system is a must in order for the client to independently add content to their website. Webflow's innate content management system (CMS) is made for this very purpose. The CMS can also be used to add different production titles to the "Tuotanto" page.