When I started to do a research about grids, I found the website (click here) which was great to get basic information I needed for my research.
Grids are vertical and horizontal lines that divide pages vertically and horizontally into margins, columns, lines of type and spaces between blocks of type and images.
Also there are two types of layout – landscape and vertical.
There are 4 main types of grids:
Manuscript grids – simple single column grid; they are used for continuous blocks of text for example books and long essays. However, images can be used to fill the space instead of text.
Column grids – it is usually used when there is different information presented
Modular grids – they are usually used for image galleries and shopping carts as this layout offers you more control of space in tables.
Hierarchical grids – this type of grid is used when non of grids mentioned above are good enough to use because they don’t fit into criteria. It is usually seen on websites.
Every single type was designed for different requirements and that is why designers need to be familiar with these main types of grids.
If you’d like to read more about main types of grids, please click here
Researched areas I will cover in my research will be:
In previous assignments I was working on my brand identity and how to best pitch myself within the field that I would like to work. In this assignment I will have to produce a brochure that promotes me.
The final submission for this assignment will require:
In semester two, I will have to write 3 essays. First one is a 2000 word comparison essay on topic ‘Analyse, compare and contrast two examples of graphic/design interface or two examples of user experience online from the 20th and 21st century‘.
My first idea was to compare design and user experience of old (one of the first) websites ever created and new ones. The reason why I thought it would be a good idea was that design of one of the first websites was very simple, consisted only from text and maybe a few pictures, that was it so they couldn’t give users a lot of user experiences apart from information that they were looking for. However, technology and everything developed so much since then that websites these days not only give completely different user experience to users but also information that they can get. I thought it would be interesting topic to research but when I had a conversation about my task with my sister, she gave me a better idea what to write about.
I am going to write about Amazon and Facebook. These two websites are great for this topic as there is sooo much to research and write about.
I will do a deep research about Amazon and then Facebook for example who, when, how, why they were created (basic information). I will write about user experience on Amazon and what it gives to users for example shopping online while you’re sitting at home watching tv, ability to find anything you want to buy without having to go around shops (sometimes when you go to the store and they don’t have what you want, they advise you to look online), easy and accessible website. I will use information from lecture in semester 1, where we watched a video about ‘virtual revolution’ and one of the topics was Amazon. Everything that you type into search box is remembered so they can offer you similar things you might be interested in or similar things that people who bought the thing that you want to but were looking at; basically it influence you and your decisions. There are many more things to write about.
Then I will write about user experience on Facebook for example it allows you to contact people on other side of the world that you would not be able to know without Facebook, keep in touch with friends and family, free and easy access to fun but also I will talk about ‘dark sides’ of it like loosing privacy and ‘paying the price for free using of Facebook’ (this will link to my research in semester 1 about social networks and also to Jane McGonigail’s talk on TED – social networks might give people feeling that they belong somewhere. Also Sherry Turkle’s book called ‘Alone Together (Why people expect more from technology and less from each other)’). It will be relevant to Amazon as well.
Later on, I will move on to design part of these two sites and compare them.
I must say that I’m looking forward to write this essay as it is going to be very interesting to read and write about.
I opened Adobe Photoshop CS6 and started to design. This is what I came up with –
As you can see on the picture above, I tried to stick to colour scheme that I’ve chosen but I don’t think it looked good. Title of the site is in white colour but middle word ‘healthy’ is in rainbow colours because I thought that it might give it a bit of ‘playful’ look; rainbow has 7 colours and this word consists of 7 letters so I thought it would be perfect. But when I looked at it later on, I didn’t like it!
After consultation I decided that it is not good design at all and I didn’t like it because it does not look professional at all.
After unsuccessful first attempt of design and consultation, I had a few very good ideas drawn on the paper.
As you can see, there is a new layout of the site drawn and instead of words in navigation, I decided to have icons that symbolize words instead. The reason for that is that this task is more about the design than about anything else and people automatically link pictures to words, it is common sense and humankind did it thousands and thousands years ago when they painted pictures in caves.
I opened a new page in Adobe Photoshop CS6 and started all over again. This is what I came up with but this time, I sticked to exact colours that I’ve chosen –
As you can see on the picture above,there is a massive improvement and professional look added into it comparing to my first design of the site. I sticked to font colours and the reason why it has two different colours is that I wanted to make word ‘healthy’ to stand out a little bit so your eyes automatically look there. They layout of the site stayed the same, I just toned down colours so it does not ‘shout/scream’ at you as much as the first design did. As you probably noticed, the left sidebar for navigation is empty as I am having a problem to find right icons on internet.
In my previous posts (click here to read more), I was talking about colour scheme for my website. However, after quick visit of a shop one day, I saw a box of tea and colours were just beautifully matched. I took a photo of it on my phone so I could work with it later on. (Inspirations are everywhere around us!)
I did a little research about theory of colours to see if I could actually use it as my topic is ‘children’s healthy eating’. I found that purple colour is ‘the color of good judgment’ and that most children love this colour. I also did a little research about personality of people who like purple colour and I found out that those people are sensitive, supportive, thinking of others before themselves and other people like to come to them for help. (read more about it here) All of these information gave me a good evidence that this combination of colours for my website would be a good choice as I want to target parents instead of children (read more about the target audience in my post here) even thought it is unusual colour scheme for website about healthy eating. Colours that are usually used are green, brown, orange, gingery colour and soft blue.
This website is different than the previous one I was analysing. It is a website about architecture called Hellen & Hard.
When you first look at it, it is nothing special, nice elegant and professional looking website. However, when pictures start to move (or you move it with your mouse), it grabs your attention because pictures move up and disappears and it looks like you look through photos in a real life. I think it is very interesting! Colour scheme is very simple and professional – grey and black.
Navigation of the site is very simple and easy to use. There is only one main navigation under the header and it always tells you where you are on the site (which is needed for users to easily orientate on the site). However, when you click on ‘People’, there is sub-navigation. You can choose between five different professions and it will highlight pictures of employees (I think it is very clever and I like it a lot, it makes it easier for users to find out professions of employees). Another sub-navigation is in ‘Project’ section, where you can choose what projects you would like to see and it takes you to gallery. Overall, navigation is simply to use on this site all the way through.
After selecting what project you would like to have a look at, there is a presentation of the images with all information you need to know underneath it. Images in presentation move themselves however, you can move them with the cursor. Content is relevant and well structured on this site. If you cannot find some information, you can contact the company straight from the site.
I think this website is dynamic because there is a contact form. This website is working in Opera 9, Chrome, Internet Explorer 9, laptop, PC and mobile but it is not a responsive.
My task is to research and analyse two existing gallery sites.
I typed into Google ‘gallery websites’ and it started to come up with websites of galleries but they were real galleries not what I needed. So I changed it into ‘gallery website inspirations’ and it came up with quite a lot of interesting websites. I opened link www.thebestdesigns.com and the site that grabbed my attention straight away was this one – www.stockbridgeyachts.com
It is yacht website where you can buy/rent yachts. I was very impressed with the design and excellent user experience that this website gives you.
As soon as you open the site, your attention is grabbed by presentation of beautiful images of yachts on the sea. All colours were chosen carefully so it fits into colour scheme and creates a nice professional effect.
Navigation is simple and straight forward so users can easily orientate on the site. There are three types of navigation; one is on the top right under the header and it’s scroll down navigation. Second one is in the middle of the site (little circle) which helps users to go straight into browsing yachts. The last one is the biggest one on the bottom.
After selecting option of browsing yachts, the site takes you to gallery of yachts where you can set up your requirements or choose yacht that you like and it takes you to the main gallery with beautiful images of selected yacht and information that you need.
Usability of the site is great, the design is responsive so it is a big advantage these days as more and more people use different devices for internet. Content of the site is great and tells you everything you need to know and if there’s missing something, you can contact the company straight from the website.
This website is working in Opera 9, Chrome, Internet Explorer 9, laptop, PC and mobile. I think this website is dynamic as there is a contact form for contacting the company straight from the website. What I know for sure is that this site was built by HTML5 and CSS3.
After my feedback from semester 1 (which I’m very happy about!), I am going to set myself up three goals that I want to achieve in next semester.
Goal 1 – Work harder so I get even better results than in semester 1
Goal 2 – Try phrase sentences in essays differently (more professional)
Goal 3 – Have a very good blog
Veronika Lesnakova 