Changing the Nav bar and adding Symbols

During the main user test of my prototype, I realised that having something to signify that text can be hovered over would be a good idea. This is something I included in the last screen of my prototype by changing the colour of one word within a paragraph. The issue, is that you can’t do this on Webflow.

I decided that including a couple of asterisks (they look like little stars in my chosen typeface [Mina]) in front of interactive text could be a good way to do it.

 

For example:

 

 

I also realised, as I conducted a quick, final user test on my website, that having a “Next” button in the nav bar made this confusing for the user. I watched the user wonder what to do to continue, and instead of scrolling down, they clicked the next button in the nav.

I have a “Click here to continue”  button that appears at the end of each page, either after you scroll down, or have read the text shown. If you don’t wait to read the text and see this come up – then I can understand why you’d be inclined to click “Next”.

Because of this, I have decided to remove the next button from my navigation bar. It was never really necessary anyway because of the call-to-actions included on every page.

I am, however, keeping the “Previous” button in the nav, as I think it would be good to have the option to go back a page in case you missed something, or want to re-read just that page rather than going back to the start.

 

Old Nav Bar:

 

New Nav Bar:

 

I also decided to move the buttons around a bit so that the ones linking directly to the narrative part are together, and the crew button is separate. I thought this made a bit more sense, and differentiates the “crew” page from the rest.