Back to Index : Index.html
The Navigation bar is split into 3 parts.
1) The banner : I decided to have a banner that lets the user know this is my portfolio site where they can read more about me. I feel this is very informative for the user which is key in visualisations and user experience.
I also added a dropdown menu to the banner so users can see other features on the site. I thought this was a good idea as it doesnt cram the navbar with too many headings and overflow the user with too much information and buttons. I feel its good for the user experience to split the heading into 2 navigation sections. I kept the most important features on the navbar.
2) The rainbow bar : A skinny line which goes between the banner and navigation bar, the rainbow line adds a bit of colour to the site and blends in with the site nicely.
3) The navigation bar : the navbar is simple but effective, it gets to the point but still uses a lot of style in the font size, style and weight and the use of icons add a nice touch too the user experience. The navbar makes accessibility for user experience easy and efficient.
I used a parralax with an image in the background of a laptop. This lets the user know that its a computing portfolio site about me.
I also think the parallax adds a nice design effect to the site while also splitting the site into its different sections. It also adds consistency to the site which I feel is important for user experience.
Throughout most of the site I used rows and columns dividing up the content on the site or separating images.
Users are used to sites being divided up neatly and I think bootstrap rows and columns are the best way to deliver this.
For the about me section I used Modals to show more information about me and also show my skills. I think a modal is a good idea because you can give the user the option to look at more detail without overflowing the page with too much content, the user can decide if he/she wants to see more or not.
I used buttons throughout the site becasue no matter what site you go onto they always use buttons for functionality. User feedback is critical in designing a site and most users like to use buttons to that is why I used them.
In one of my modals I used a row featurette to divide up my site.
In my interests section I used panels to divide my content and images. I thought panels were a good idea here as they add a bit of colour and fun to the site which further portrays my interests and personality.
I used tabs for my grades so user can tab through each year of results
I think this increases user learnability as they can easily tab through each year and clearly understand the grades section.
I also used tabs for my projects section. Here users can easily see my projects by tabbing through each. This keeps the content on this section to a minimum yet provides the user with a lot of info on each project.
I used a carousel for my projects to show the user different images of my projects. I think this adds to memorability in the site. The use of content and a carousel for imagery makes the user experience more memorable.
I used a map to show where I am. This allows a user to know how far I am from them if they ever wanted to meet up or offer work.
I added a function to allow the user to send an email. The email fuctionality doesnt fully work but input details does.
I added a javascript search bar that when the user searches it routes them to google. I was going to add to this function further by routing back through to my site and getting what the user has searched on my site by Id (document.getElementById("txtsearch");) but for this to work I have to buy a domain name as github pages is not recognised by google, maybe in the future I will purchase a domain name and get this working.
The show more button returns the user more results. I used this for the education and work experience section.
I added an alert to let the user know there email has been sent.
I added a jquery function that allows a user to smooth scroll through the site. I feel this is an important feature in the site and for user experience as it allows a user to see clearly what they are doing and the page doesnt jump abruptly.