Before I started designing my portfolio, I took the time to research other existing online portfolios to gain inspiration for my own. This is shown on one of my blog posts, found at this post. I then went on to create a series of wire frames that helped me to explore different designs that could work, possible colour schemes and what would needed to be improved. I created quick mock ups on Photoshop to allow me to visually see what my final layout design could look like. I wanted to follow the ‘less is more’ concept so that my website is legible, easy to follow, but is still eye catching and aesthetically pleasing. Links to show this are:
Post 1 (initial wire frames. Idea for gallery thumbnails was inspired by the top design)
Post 2 (Using a different colour scheme)
Post 3 (Decided on a colour scheme, but still need to play about with the layout)
Post 4 (Layout completed, slogan finalised and designed myself a logo)
I decided on 4 solid pages that I wanted to include. These were:
• Home Page
• About Page
• Work Page
• Contact Page
On the work page, I wanted to incorporate some form of gallery to allow users to interact with my site and look at the work that they wanted to. My ‘gallery’ consists of thumbnails of my work so that people can visually see what that piece of work involved. These thumbnails also lead to a web page dedicated to that one piece of work so that people can see what I did in each project. I also included a gallery of my own photos that I have taken which users can interact with by physically going through the gallery themselves. I have also incorporated a Facebook badge on my contact page. This allows users to be directed to my Facebook page and so, interaction is continued even outside the website. This is also the case with my Twitter widget which is also found on my contact page. To allow people to quickly access my blog, I have included an image that acts as a link. On rollover, the image changes colour to show users that it is a link. This allows them to easily find links that are incorporated in my website and make navigation a lot more simple for them. At the end of the day, I don’t want people getting frustrated over trying to find links!
I believe that it is very important people have as much access to my different sites as possible. Whether it be social networking sites, or others such as my blog. This means that people can easily get in touch with me if they require my help, want to send feedback, or maybe even get in touch about possible employment!
Overall, I am incredibly happy with my final outcome. I have never done work with HTML or CSS coding and to say it was my second project in Interactive Media, I think I have really excelled myself! In order to produce the final design, I have had to look at a lot of tutorials on the web and videos in order to find out how to do certain things. For example, I wanted to know how to add the twitter widget and Facebook badge. Obviously we have not been through this in lessons so I took my time to find out how to do it. I am glad I did this as it increased the interactivity in my site and people could very easily get hold of me if needed. Creating rapid prototypes of my final design on Photoshop really helped me to come up with a final design in a short space of time. The advantage of this was that I then had more time to actually add the content of my website, and was able to perfect it with the time left.
No comments:
Post a Comment