Wireframes – Adobe XD Experience Design

These are wireframe designs for the website I created after defining the pages needed in the sitemap.  I have created these using Adobe ‘XD’ (Experience Design) and have annotated them to give my client a feel of how the designs will work and explain the different areas to them; this is useful especially if I had to email these to my client and cannot meet and discuss them.

Home Page

screen-shot-2016-12-01-at-09-32-05

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

My Story Page (About)

screen-shot-2016-12-01-at-09-49-39

 

 

 

 

 

 

 

Blog Page (First Design)

This is the first wireframe design of the blog page I created.  Once the wireframe had been created it was clear there was a lot of text on the page and not many images and possibly not as engaging as it could be.  The layout could also be classed as dated as this is a custom blog design.

screen-shot-2016-12-01-at-12-03-44

 

 

 

 

 

 

 

 

 

 

 

Blog Page (Second Design)

This is the second wireframe design of the blog page.  Blog posts are listed in column layout each with a separate image with the option to view each post by clicking on the image.  By including images it is a way to engage with the user quickly.

screen-shot-2016-12-01-at-12-03-54

 

 

 

 

 

 

 

 

 

 

 

 

I will show these to my client at our next meeting and discuss the design and layouts and get her feedback.  At this second meeting I hope to be able to see if I can go ahead with these design and if not what alterations do I need to make.

 

Advertisements