Third Design Stage

The third step In the largest step in the process of the design, there are a lot of key factors that come into play between this and the previous stage of my design. Here’s the design;

Firstly, the biggest change you will see is the colours, I searched through http://www.colourlovers.com/ and found a colour set based on army colours;

It seemed appropriate to use army colours since I was illustrating the effects of the war and the military has large role in this. By using the colours I have done, it makes it much more obvious that my site is about the military than the bland colour palette I had previously had. Next you will notice the video the top has been removed and been replaced with an image.

I thought this would be moire appropriate as again, the purpose of the site would be the impact of the facts, so I didn’t want any distraction, by having an image that visually helps the user understand what the page is about it seems much more effective and works better with the flat design. You will also notice how I have added images with a low opacity to blend into the flat colours to give it a little extra detail so that the user has something as to relate to, therefore the budget section has an image of money, oil sales section has an image of oil rigs, the deaths section has a soldiers hand in the air, and the 9/11 section has an image of the twin towers with smoke billowing out of them. You can examples of this here;

You will notice how I have now completed what the military did and could have bought with the budget section again with their own colour schemes to set them apart and making the war side darker to illustrate the greed.

Relating the design back to the first concept on paper (https://akbrodie.wordpress.com/2014/12/30/initial-war-site-design/) you will notice how I have kept in line with the way I split up the different sections to give them different content. At this stage I was I was reasonably happy with the design being almost complete so I decided to add some interactivity into the page so that rather than just it just being scrollable there are actually areas for the user to click on. First was to decide the areas which would be most shocking and then deciding to use those areas for the interactivity. I decided to use the statement made by each president an interactive part so that you could actually click on a video icon and watch him saying it. You can see both examples here;

 

Next was adding more detail about the more important facts so that it wasn’t just more interesting, but also more believable. I did this to the only two sections that I felt it was appropriate to explain more about, the first one being who made the most money from the war, you can again see my example of this below of the 11 different sections;

The next section was about the oil reserves that Iraq had when the US invaded, and I believed this was an important part of the war because it was one of the main reason why the US invaded in the first place.

 

Something else I have changed since the earlier design is the font, which I changed to Century Gothic, I did this at it features in movies and games that focus on war and violence, you can see three examples below;

Something that I believe needs change is the way the viewer purchases tickets, if you are to capitalise on the experience the user is having, you need to make it incredibly easy for the user to buy tickets to the exhibition, preferably without leaving the page, this means the user doesn’t get sidetracked or distracted, so that you can capitalise on the emotion of the viewer while they are still shocked by the facts and want to learn more. This is the current state of the ticket section before I change it;

The final thing worth noting about the design so far is the call to action section, in my research I found a site (http://www.digitalrainforest.co.uk/) that had an excellent call to action at the bottom of the page, you can see it here;

The site is about how corruption and poverty leads people into cocaine farming in Peru and also how hard you must work and the health risks if you are to farm gold, cows or even chop down rainforests, so it basically sums up with three images what you purchase as a result of everything on in Peru then has a simple statement “if you think this has nothing to do with you, think again and get involved” which I thought was really empowering so I stole it for my design but changed the concept to keep it in line with the general design of my page. I placed a oil drum on the page which went to a petrol pump which led to a car with the same statement below it. I think this is an excellent way to get people involved, you can see my version on my design below.

Advertisement

Second Design Stage

The next step in doing my design was to get my initial ideas onto the computer, so here you will see quite a large jump in progress but at the same time, there are bits missing at this stage as I haven’t yet completely finished adding the content but this is the style so far.

At the top you see a video as soon as you land on the page, it would automatically play as soon as you land on the page, there is simply a button there to represent it being a video. This video will include America propaganda, visuals of war related events and presidents speaking in a reasonably fasted video. It also shows the top of the next section which is about the military budget and how it’s spent. as you can see war and peace are split up into columns with their own colour scheme.

This section is still about the military budget but it shows the individual things the budget did, and could have bought. To keep my design flat I have decided to use icons that represent the appropriate items, I think this helps the simplicity and focuses the viewers attention on the actual facts themselves. There are some sizing issues that will yet need to be covered.

This section is about the economy and how it could about gaining wealth, I have introduced this section with a quote old president of the USA, George Bush which is about how every us citisen should go shopping more, the day after 9/11. I think this really works because even in this early stage, when I show peers for review, they all seem very shocked and say “did he really say that?”. I think this will create more intrigue as to the content of the section.

The footer is where the call to action happens to get the user involved with social debates.

You can see from this early stage the design is coming on nicely, it is taking form with a similar overall theme.

Initial War Site Design

So for my design, I already had researched and arranged the content I wanted to to have on the page (you can find the earlier post with the content on here https://akbrodie.wordpress.com/2014/11/15/facts-about-iraq-war/), I knew the general theme I wanted to go for, it was time to get my initial ideas down on paper. Having completed research on grid layout I knew it was important that my content could be presented using a grid. Here you can see the initial designs;

You can see from these designs I have started to split the screen into two, left & right, war & peace. You can start see that by using the different sections, I can change subject or style quite substantially without it reflecting on the flow of content. This seemed to break the page down into bite size chunks which made it easy for the viewer to digest. Using larger than usual images and fonts draw attention to the text, therefore the impact is the facts not the design.

Something that is shown in this initial design though that I decided not to carry through was the droplets of blood. This is something I thought worked well in a the design of a website about fracking (which iI wrote about in this blog post https://akbrodie.wordpress.com/2014/10/27/website-analysis-2-dangersoffracking-com/ ) where you follow the water droplet down into the ground. Basically it was going to represent the blood split from the wars I was discussing in the design. I thought it wouldn’t work in my design though because I wanted edge slightly away from the flat appearance of the site by adding faint images of war in the background, and I didn’t think that would have worked well with a flat designed blood droplet.

Starting a Revolution

Using the site to create an reaction is something that is important, of course, I would want people to visit exhibition, but if I could make it into a worthwhile cause that people could fight for, it would not only mean it would not only have a deeper purpose but it would also mean the exhibition would be able to capitalise on something great. Like I stated in my exhibition post, turning a viewer of the page into a visiter of the exhibition, which would carry on after they’ve visited the exhibition so they could start a ‘revolution’ to make more people aware of the exhibition would make really help because it would make the whole exhibition much more successful, and that’s the purpose of the site. Understanding how to create such a revolution will help me improve reactions to the immersive experience that I am designing. A major part of this is playing on the viewers emotions to get a reaction relative to the situation.

The new Russell Brand’s new book Revolution does exactly this, he discusses the flaws of modern society backed up with facts from credible sources and then with the launch of his book has created a ‘credible news source’ called “The Trews”;

where he depicts what is really going on in the world. With this he is obviously in the public eye already so that helps, but he has also been able go on multiple talk shows and discuss the issues with modern day culture and get the media discussing him in good or bad light, this all creates attention around the book, I would say this is basic PR for a celebrity. Russell goes further though, he releases a daily video on his YouTube channel discussing a variety of issues that range from government, press, consumerism to war. A story that has captured mainstream medias attention is the one where Russell helped “93 ordinary families stand up to corporations and lazy government and won”. So not only has he released a book and done the normal PR stuff, but he has chosen to help the people of a London community, and raise awareness of the pressing issues covered in his book, not only does this help raise awareness but it also helps sell more copies of his book.

Another great example is this website (http://www.amnesty.org.uk/) which is designed to raise awareness of the woman who is serving a 35 year jail sentence for whistleblowing on the torture carried out by US Army and the CIA. It firstly has call to action button for people to sign a petition for the release of the woman, then when you scroll there are more articles about torture. This site uses flat colours which helps the user focus on the content and I think this is something that I will use in my design.

Greenpeace also make very emotion tugging video to pull on the heartstrings of the viewer. In the space of three minutes they show the devastating effects that global warming is having on the environment, along with other issues such as over fishing the sea and destruction of rainforests. It then goes on to show the support of communities and the actions that the Greenpeace community are taking to prevent these travesties from happening.

I have learnt that not only creating an experience but also creating involvement so people are motivated not only to buy tickets to the exhibition but also do something about the issues covered in the exhibition. I’ve learnt that should this exhibition be real I would need to create other events and ways of marketing the site to make the exhibition not just an exhibition but a ‘revolutionary experience’ for everyone involved.

References:

http://www.russellbrand.com/tag/new-era-estate/

Current Online Exhibits & Target Audiences

(http://www.warmuseum.ca/war-of-1812/) This site is very straightforward, it combines simple graphics with last colours and small amounts of text. This website is somewhat interactive but almost seems confusing as you don’t really know what different sections are for. The footer for this page stands out really nicely as it is a lighter flat colour, that contains four elements, a quote, social interaction & two logos. While It doesn’t try and sell you something because it is just a virtual exhibition, there is still less content that other sites for actual exhibitions.

(http://amhistory.si.edu/militaryhistory/exhibition/flash.html) Is a really good website, complete with information, graphics, animations and interactivity it allows for a good user experience. There is a lot of clickable content but this can almost seem cluttered and somewhat turns it into a bad user experience. Typography and colours seem to have been seriously considered when making this site, each war has it’s own style and colour set but stays with the same general theme. I believe that because there is so much content available that it wouldn’t intrigue the user to want to visit the actual museum/gallery itself. The content of the site actually tells the entire story along with photographs of the artefacts that you would usually go to the gallery to visit, this makes a trip to the gallery almost pointless unless you particularly wanted to see it in person.

(http://www.nam.ac.uk/exhibitions/online-exhibitions/waacs-war) This website is very straightforward, it is all contained within one page, if you want more content you simply click on another number along the bar and it will slide across. The colours are simple and flat, which allows the user to focus on the content. I found this to boring and dull, and I think this was due to its simplicity and lack of interactivity.

(http://www.moma.org/interactives/exhibitions/2013/isagenzken/) I really liked this website for it’s overall design. There is great interactivity with the menu where it is out of sight until you click on it and it becomes fullscreen, the are different colours which change and become boxed in if you hover over them. This is simple and effective as it then stands out of the crowd and because something you enjoy using. Each page is dedicated to a different part of the exhibition which works really well because the majority of text is one page whilst the images are contained on another meaning the user can view what they want.

The target audience for a museum is very diverse, it attracts people from all ages, genders and class. This means defining the target audience is very difficult,

In terms of creating an exhibition site for a museum i know I need to focus my attention on attracting new customers without alienating existing customers, this can be done and I found the “Marketing of Art Museums” by  Robert C. Blattberg and Cynthia J. Broderick that explains a lot of relevant information. This article dates back to 1991 and so is out of date with the web now in place on desktops, tablets and mobiles, this shouldn’t be an issue as some of the key concepts will still apply.

“There are two distinct types of audiences that art museums can target. The first is the group of potential donors, who often become members and are more likely to become heavily involved in museum activities. This group is small, will generate far more revenue and profits to the museum, and appreciates the current types of exhibits the museum offers.

The second type of audience is the general public, who attend museums to be entertained and to be educated. Few will ever become donors of works of arts nor will they become major financial benefactors. However, they occasionally become members and often spend money at the museum store and restaurant.”

From this statement, it is easy to understand that there multiple benefits a museum can take from their audience. These are donors of material and people who are willing to participate in events for the museum, this can be done through volunteer work. Also, more commonly the general public who spend money in the shop and cafe, I must be targeting the design of the site cause enough intrigue for people to want to visit the museum.

Therefore, understanding who the target audience is vital and while I am mean’t be basing my website around an exhibition some sites are simply to inspire action against a particular organisation. I would like to do both, meaning the viewer is intrigued enough to visit the exhibition but also then wants to do something about what they have seen. This will capitalise on every single person that first views the page. They view the page, pay for the exhibition, fight for the cause of the exhibition and then also further spread the word about the exhibition. This would be the most profitable, attention gaining, way for an exhibition to gain traction with the public by creating a ‘movement’ that has the purpose of both profitable gain and creating awareness.

References:

Click to access c11646.pdf

http://www.copywritematters.com.au/define-target-market/

Current interactive experiences

I am creating an interactive experience online for the user too learn more about the lesser known facts about war. To help me in the process of creating this I am going to research and try to understand how to best capture the user within an interactive site. Parallax scrolling is what we have been told to focus on so I will be looking for mainly interactive parallax scrolling sites but I will also look at others.

http://www.thisisnowexhibition.com is a great example of parallax scrolling being used for a an exhibition website.  It uses images with a flat colour overlay to create a texture on which text is placed upon. The texts itself is kept to a minimum and maximises the potential effect white space can have,  this creates intrigue into the content. There is a section at the bottom of the page where you can select the different designers so that you can see you can see one of their pieces of work and the option to buy it. Again this causes the user to want to see the exhibition so they can see more of the art. This is almost what is required for my brief for creating a interactive user experience, and a very good inspiration for me to start my research.

http://cyclemon.com This website is making good use of modern design techniques and that’s what makes it stand out the most. Flat colours, parallax scrolling make it simple enough to use, there are different sections which all have different bikes and colour scheme. The purpose of the site is to actually sell the artwork which they feature on the site, and this isn’t actually obvious when you are looking at the homepage, it’s only when you click on the shop i con you realise they’re for purchase.

http://www.beatboxacademy.ca/ Is a brilliant sales site for basically a box of stuff to help you learn beatboxing. The entire site can be navigated with the keyboard as it is also parallax scrolling. It’s main interactive feature is the one which you are greeted with as soon as you land on the site, a virtual set of beatbox noises which are linked up to an image of the instrument they represent and they can be clicked on or there is also a keyboard button that represents them. The target audience would be captured by this experience because as a music lover they would be able make the beats themselves with the keyboard and then if they are sold can go and buy the DVD.

http://graphicnovel-hybrid4.peugeot.com/start.html Is another excellent site that tells a story to it’s users with video, sound and parallax scrolling. Story makes the daily lives of many much more interesting finishing at the office and driving home, but instead it’s a spy mission to steal some documents from an office and get home safely.  It’s a completely immersive experience that allows the user to actually get lost in a story rather then just viewing the webpage, it’s a clever sales technique that helps to connect emotions with a product which is what Sigmund Freud started back in the 50’s.