Muse: Adding Elements

Screen Shot 2017-03-18 at 21.37.24Upon opening the page I wanted the viewer (potential clients looking at my portfolio) to see a slideshow of my design work, that they could then click on to see more information and imagery.

Using the widgets tab I could simply drop a slideshow onto the page and resize it to the size I wanted it. Placing images was the same as the full size slideshow using cmd + d. I turned of cations, thumbnails, and counter and altered the playing options, as I wanted this to automatically play once the page is opened. I changed the transition speed to 0.7 seconds and the actual transitions to 2 seconds, I felt this was enough time for the viewer to see each piece of work and click on it if they wanted to see more.

Page Design

Screen Shot 2017-03-18 at 21.56.03.pngUsing a logo I had previously I set about designing the layout of my site, the logo placement, menus and navigational tools. I had planned a few different layouts and wanted to see how each of them worked on Muse. Firstly I wanted a standard horizontal navigation menu that would then take you to each page.

 

Screen Shot 2017-03-16 at 11.20.03

Here is what I tried first with a vertical menu. I had my logo situated the top left of the page with the tabs underneath. However once I did this and linked each tab to its anchor I noticed an annoying problem inside preview mode. The problem was when you click on a tab and it takes you to a page you then have to manually scroll to the next page or back to the top. I thought about putting a home button on each page, but this didn’t solve the problem or look very professional.

 

 

Anchors a vital tool when designing a wScreen Shot 2017-03-18 at 22.09.28.pngebsite, especially a parallax design. You can click
the anchor tool which
you can then mark where the beginning of each page starts, you can see on the left picture my 4 anchors for my menu bar. You link an anchor to a piece of text, image or button by selecting it and going to the hyperlink tab.

 

 

To solve the problem I had with my page navigation I done some quick research into static menus that stay stuck to the screen no matter where the viewer navigates to. This was exactly what I needed to do so my site worked fluently. To do this I used the ‘pin’ menu on the top tool bar.

This image above (left) is where I started to experimented with a pinned menu bar. I wanted to try and use icons for the menu, the logo as the home button, a camera and photography section ect. However I felt this was too minimal to use so I developed a wider menu with the logo and 4 tabs, all pinned to the left side of the screen so it followed the user where ever they went to.

 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: