SB5: CK Web Design Wireframes XD

After the initial wireframe sketches I decided to take them digital, using Adobe XD. The website will be quite basic as it is to be made on Wix website builder, I know there will be limitations to the design so thought best to keep it simple from the start.

Version 1

The landing home page will showcase some of Catherines strongest photographs to date, the will be across the page and I will add a sideways scrolling feature. Above the top, there will be a header that sticks when you scroll on all of the pages. The header contains Catherine's name and links to the different pages: about, thrift store, pink and love vs lust.







The only difference in all of the pages above is the selected page link will change colour, this is so that the user can quickly see what page they are on. I don't feel a need to include page titles, this would just clutter the page and be unnecessary when the page names will always be visible on the header.



Above is the about page, it will include a short description about Catherine, what she specialises in and how you can get in touch with her. I asked Catherine if this was all she wanted, in terms of adding a photo of herself and other social medias - she advised me that just an Instagram link would be perfect. 

Version 2

For the second draft wireframes I added some of the photographs that will be used on the website. This allowed me to check that the layout and arrangement of type are suitable for the photographs - as they are the main focus.

This particular page layout will include 3 portrait photographs, with a landscape underneath - then repeat. This layout depends on the images, it was difficult to line some of them up and make the layout look good as Catherine's photos aren't all one standard size or dimensions. 

The homepage showcases 5 photos, the other 2 can be reached using the arrow on the far right. I made sure the arrow was bold enough you could see it, but not too thick it took away from the image it would be living over. 

Version 3

The main difference for version 3 is the change of typeface, and the colour of said typeface. There was also an adjustment to the size of the header, I spoke with Catherine and she said the photographs should take up as much of the screen as possible. 

Now I have the layout planned, I can go into Wix and create the website straight away rather than having to decide on layout etc. when on the software. I am hoping that the website builder won't limit the designs I have already made too much, but if they do I can always work with what I have got.