Module: MMc403.2 – Web Design and Development (what I couldn't say)

I originally thought, I would go up in front of the class and talk about my thought process for this assignment but due to nerves, I will have to explain everything on my blog.

Brief: To design a website that will persuade a set target audience to visit my island, in a four weeks, time span..

About the Island: It's an isolated island, governments from all over the world, will send their worst criminals there. The people delivered to the island, are sedated and checked to prevent them from attempting to escape, they are then dropped from a passing plane with an automatic parachute for save landing.

The only land the island is closed to is Cannes in France, officers will be stationed around the coast, to keep their eyes open for any makeshifts rafts full of people or a person, and would be ordered to shoot on sight if they do.

Mood Boards:

None of the pictures are mine.

 

This was my first mood, right at the beginning so I had absolutely no idea what I was doing, this was really a half attempt of trying to think of something and kick start my brain. I had no clear vision of what I wanted to do, so I tried to get any images related to island.

Since the website is designed to persuade governments from all around the world, I started looking for a much darker tone in terms of the colour scheme and a more mature vibe, so I'll be taken seriously.

 

For the text, I was looking for a more mysteriously and darker vibe, away from my using 'Impact' obsession, I wasn't looking for anything cheery, I found that it would be extremely off putting considering what the website is about. 

 

 

My second mood board was my brain finally working, I remembered that I should remind myself of the purpose of the website while looking at several design for home pages and since I couldn't name my mood boards 1& 2, I tried to liven the names up a bit.

 

I than did a couple of rough layouts in my sketch book and posted online.

 

Layout for website, that I did in my sketchbook:

I started to think about the website as if was being viewed a mobile phone, because I know of several examples out there that had their websites in a different format depending on which system you are on, like Ebay, Amazon and YouTube.

 

In this, it also shows, a bit of the layout for the 'contact Us' form that I plan to do and how the website would work using touch technology. 

 

There is also, two of my early idea's for a page layout and how the tabs will retract out, just by pressing one tab with your finger.

Than I started to think of the little things, like the play button on the video's on the website.

Design for the button play.

As you can see, I started with a basic triangle and evolved from there before I was happy.

If this was on a video, it would roughly be like this:

Link: https://www.sendspace.com/file/vecmhu

I than decided to put my island flag up, for inspiration.

I created 4 colour scheme using red and black from the flag.

In the end I chose number 4.

 However, I wanted my website to look mature and professional so I pulled back the hue in adobe photoshop.

I than started taking prison related things from the internet, for some reason.

I rather liked the jail cell picture so I thought about, what if this was my home page?

By this point, my half baked attempted, had become full blown idea.

 

I was thinking of having the large image fading in, the moment the link to website was clicked and than the text will slowly appear, it opacity 50% or so, to blend with the background.

I than had this idea to do a brain animation, using the brain on my flag, and was full prepared to go do so, but I managed to stop myself.

 

For one thing, a file that large can never make it onto blogger or even Sendspace, I would have to provide a link on YouTube for it work and I didn't have the time for it, so I settled on describing it on this blog.

I than went on to look at Goverment offical websites for more inspiration:

http://www.australia.gov.au/

https://logon.slc.co.uk/cas/login?_locale=en_GB&service=https%3A%2F%2Fwww.student-finance.service.gov.uk%2Fcustomer%2Fhome%2Fpages%2FmyAccount%2Findex

 

And this how it turned out.

Now you may be asking... how I went from an explosion of idea's to something so simple, as this?

 

Well, I realised that since this website main purpose is to appeal to governments all around the world, their not going to care how nice looking my website is.

 

What they would care about the most, would be the information they need to absorb and how well it's conveyed.

 

As long as it looks clean and polished, I had fulfilled the website purpose.

 

Now I'm going to explain to you, how and why the website is designed like this.

 

When I produced this in adobe Photoshop, I was working on a mac so I couldn't help but notice the faint scroll bar in a google Chrome, I really liked it so I added to my design.

 

I noticed in the Australian government, there is a picture right after the border, and I liked the idea, so I put a picture of my island underneath the border.

 

The 'border' is actually my chosen colour scheme, super stretched in Adobe Photoshop.

 

I've also noticed that in the two websites that I've viewed, they both have a search bar in their header so I thought why not add that to mine? 

 



Website Address in the header: The website has the word 'Guest' in it's web address. This is actually from my poster for my island, the intention behind the world is a bit dark, the word 'guest' makes it sound like the island is a vacation paradise, where you check in and check out.

 

However on this island, prisoners check in but they never check out.

 

Like I said, it's a bit dark.

 

Why I used the font 'Impact', it's because I fell into my old habit, I love to use this font.... a lot, you'll eventually noticed once my AMV video up.

 

The font is bold and it immediately attracts your attention, however when you click on one of the tabs, the other fonts come into play.

 

Tabs: the colour of the tabs were inspired by the prison clothes from earlier, it makes the tabs stand out, the tabs are also fixed so when you scroll down, it wouldn't disappear like the rest of the page and will always be there on the page for you to see.



Reading Week

I was encouraged to draw for reading week.

I just to decided to sketch, I didn't know what I wanted to sketch but I sketched and before I know it, my simple lines took on human form and I was remembering what I learnt in life drawings about the human body. Those lines became the best human skeleton and from there it progressed into the finished image.

The top right came about because I was trying to go away from the manga style that I grew up drawing and I was going for a more 'Star Vs the Force of Evil' characteristics. The shows style reminds of this online game called 'Poptropica', of course the faces are a lot more expressive in the show but the shape of the heads are pretty similar.

The middle one the right hand corner was a further developed image of my final piece from one of my chapters.

Link to website (It should be working)

https://chachingmel123.github.io/MyWebsite/

MMc401.3

Summary for the Group

For the two weeks- overall goal is to set up a minute and a half trailer, six still images, so we have enough but not too much.

The six still images will be in 3D, and then in 2D.

Tom Willimett:  brief 6- Creating character illustrations and a Character decal for the camera.

Thomas Morris: brief 3- Combining the six images to create the minute tra  iler.

Melody: brief 4- Sum up the chapter for the whole group and send it and help to create the script for the voice over.

Adam: Brief 8- to know exactly how long it needs to be to the exact minute, creating sound assets for the trailer and music.

Curtis: Brief 7- Creating assets and props for the 3D stills, for example building.

Hassan: Brief 6- Gathering photography for concept drawing, add textures.

Matt: Brief 7- setting up 3D still images within Unreal.

Scene Ideas:

Pitch black with a tiny bit of light.

Curtains open.

Empty bathtub.

A table with coffee on it.

Scene 1, can be the outside of the building, than show one of the rooms on the inside, and then add one of stair cases.

1: Do the outside of the Hotel- rain.

2: Inside of his room, its pitch black with a little bit of light- alarm clock

3: The same room but with the curtains open- do his hand

4: The bathtub- do his legs.- dripping tap.

5: the stairs- his shoulder and head.-footsteps

6: looking outside with no traffic- a hand with a cup of coffee, shoulder and head.- Police siren and rain.

Character description: Based in Cannes and the main character is Russian.

What the group is doing: The Group has decided to make a game from my book ‘The Winner Stands alone’. My role is to read the chapter and then break it down for everybody else. We have created a group chat, and I would also be making a storyboard for the whole chapter, I am also assigned the task of  researching the buildings in Cannes and doing a script for a voice over.

Self-directed Project Proposal Form

The project proposal form is written by students to set out what they intend to do as part of their independent study.

Below is the project approval form, you will need to complete add this additional information to each section of this form. Once you have completed the written part you will need to upload this file to your tutorial folder on your G Drive

       

1. Project Title – short title Write down the brief project topic in four to five words only.

Cannes Murderous Obsession.

2. Summary of the project – 100 words approx. Write a short summary of your project. If this is a brief from a client write the brief here. Write down and interesting notes in the clients brief.

We are going to do a trailer, it’s made up of six images, those images would be a combination of different media, there will would be original recorded sound to go along nicely with the images. The images will be modeled in 3d but it would be render in 2D, it would be rendered in half prospective, it not quiet in first person neither is it in third person. It would be an over the shoulder shot, meaning you would never see the main character full body. I am in charge of breaking the chapter down for everybody and then doing a storyboard for the trailer and writing a script for the main characters deep and dark thoughts.

3. Write about your Motivation to do this project/ the challenges / learning Objectives you hope to address – 100 words approx. Why is your problem interesting and important? Which challenges is your project hoping to answer?

Well, since I’m pretty sure that the place in which the trailer is going to be set in is written in the book and it might be found in Google maps, it doesn’t leave much in terms of imagination, however what would truly test me is the script for the voice over I will be doing, I have to find a way to convey the character dark thoughts and how deep his obsession is for the women who left him. I have just recently started to plunge into the human mind and produce dark stories, since i’ve been writing for some time now. I have just recently stopped making the characters I create so one dimensional and have started makin layers on top of layers, so it would be interesting in trying to get into the mind of an ex-war veteran, who can’t accept that his wife left him for another man.

4. Project Plan / Schedule

Great design is built on good research. Great design doesn’t just magically materialise it’s built on user insights and understanding, and this comes from good research. It comes from understanding the client’s needs. Write a concreate description of what you plan to do. Your research plan must include clear milestones for every day until the project due date. Please consider a lot of research and ideas development is needed, it’s better to take time on your research and have a very clear idea of what you plan to achieve and why

Complete a description of what you plan to do for the following dates:

11/11/16    - 15.00 individual Presentation of what you will be working on for this project

16/11/16     - doing a story board for the trailer.

17/11/16    - Doing a script, trying to get into the mind of Ignor, the main character of this story.   

23/11/16    - 10.45 Hand in and present your work

  Concept art for the trailer: Before idea.

One the scenes that may be in the game but since we  decided to do a trailer, this image was  irrelevant, this might be put in if we  decide  to do a full game.

Maybe some character asset's in case the game goes down a kind of gladiator route.

These are poses that I brainstormed that the playable character may do be animated to do, it was early so I was just experimenting.

Me, exploring a more western idea, this is a character sheet for a horse that I came up with, I looked up horses for inspiration and to help me with the poses.

This is me exploring a more open world idea, the first two were from the top of my head and than I started researching buildings in real life and realised that a building didn't have to be straight and by the book, and a building can be very interesting to look at.

The more open world image that I came up with, came about with me remembering an image from a How to draw book and it was city using three different prospective and I loved it.

This drawing came about in case the game went for the futuristic look and I always wanted to draw a hovering car.

More game assets.

Story Board Sketches.

 Full image of the first scene, colored.

Screen Play for the Trailer by me.

Fade in. 

EXT: Hotel Martinez: Cannes- Day 

In front of the famous Hotel Martiez in France, it is early morning and the sound of rain can be heard in the background, raindrops are falling. 

Fade out: 

INT: Inside a Hotel room. 

The room is darkly lit, only a little light is let through, displaying barely closed curtains, in the background the sound of alarm goes off, 

Voice: 

*yawn*, It's time to get up. *sigh*. No matter how many times I've done this. I still can't used to not having her here by my side. 

Fade out. 

INT: The same Hotel Room. 

The scene is the same, except, the curtains are now drawn open and light invades the hotel room, pushing out the darkness, we see somebody hand, but not their whole body. 

Voice: 

 Well, It's time to have a bath, today is a big day after all. 

Fade out: 

INT: Hotel Bathroom. 

The sound of a dripping tap can be heard, and again we only see, one body part, somebodies feet is sticking out of the bathtub. 

Fade out: 

The head and shoulder of the character is shown, beyond, that are stairs which spiral downwards, the sound of creaking steps can be heard. 

Voice: 

I can't wait to see her again. 

Fade out: 

INT: A window showing the outside world, there is no traffic, before the window, a table is shown, on that table there is a hand on a cup, you only see the character head and shoulder. 

Voice: 

She must be so scared. It's not easy being human, it's only natural to stay unfaithful, it's all clear to me now. I need to reassure her and tell her I forgive her so she can come back to me. The only way I can. 

Fade out: 

[Blackness] 

Voice: 

By destroying a few worlds.