BA6: Progression Portfolio

Sarah Fletcher

1001685

http://studiomao.blogspot.co.uk/search/label/BA6%20Project%202

Showreel

Before making my own showreel, I had to look at how others have made their showreel. In order to do that, I had to look at what my role is. This is the question that left me confused for most of the course until a couple of weeks ago and I decided that I am a Narrative Designer.

Originally, I thought I was a Game designer and while I do enjoy designing games, the area I want to focus on is the narrative behind the game. The foundations of the game. It's the narrative to a game that I'm interested, not so much the game play itself. That is why most of the games I player are role-playing games (and usually strategy or turn-base). I'm in the same mind with films and animation: its the story I want to know.

So I looked up the term, unsure if its an established role and it is, although still young one.

http://narrativedesign.org/2011/09/what-is-a-narrative-designer-3/

http://www.gamecareerguide.com/forums/showthread.php?t=9

Finding showreels for this was hard and came up fruitless. So I looked up writers (like I did with website design) as well as directors.

One example I looked at showcased the writers script and then the final production of it so I decided to go with that, showcasing that I'm a writer and then I can develope from the original written document, to script, storyboard and then final production.

https://vimeo.com/14303579 (I cant seem to be able to embed videos from vimeo on here)


My own showreel can be seen here: https://vimeo.com/42486549

I used music from: http://dig.ccmixter.org/dig?user=cdk which is free to use. 

website design v2

After taking some feedback on the web design, I've made some alterations.

It was suggested to add drop shadow to the showreel and alter the twitter feed as the logo didnt stand out enough.

I've carried the dropshadow through to other pages instead of having just the border around the text areas. 

After more feedback, I've further altered the dropshadow and also cleaned up the html coding for the text areas, making updating it easier.

Website Design - Coding Stage

So I've gone for the cute design over the formal design and began coding it.
Its available to view live on http://amatterofmao.webs.com/

I've completely coded it myself using basic CSS (cascading Style Sheets) and HTML (HyperText markup language) after spending the week reading up on both.

The CSS I've used on the home page is:
<head>

<title>A Matter of Mao: Home</title>
<style type="text/css">
body
{
border:#cc9999;
position: absolute
max-width:800px;
text-align:center;
font-family:Helvetica, sans-serif;
background:#cc9999;
}
a {
color:#cc9999;
text-decoration:none;
}
a:hover {
text-decoration:none;
color:#BBBDC5;
}
.frame {
text-align:center;
font-size:10px;
width: 900px;
margin-left: auto ;
margin-right: auto ;
position: absolute;
left: 50%;
margin-left: -450px;
top:-5px;
padding:10px;
margin-center:0px;
overflow:auto;
letter-spacing:3px;
background:url(http://img860.imageshack.us/img860/2564/journalbackground.png) no-repeat top center;
}
.header {
color:#8b7d7d;
font-size:15px;
text-align:left;
height:450px;
margin-top:55px;
margin-left:150px;
padding:10px;
overflow:auto;
}
.nav {
 color:#8b7d7d;
 font-size:15px;
 text-align:center;
 height:450px;
 margin-top:-325px;
 letter-spacing:3px;
 padding:10px;
 overflow:auto;
}
.content1 {
font-size:10px;
text-align:center;
margin-top:-400px;
height:400px;
width:450px;
padding:10px;
border:#cc9999 1px solid;
overflow:auto;
}
.textbox {
font-size:10px;
text-align:center;
margin-left:100px;
width:670px;
padding:10px;
border:#cc9999 1px solid;
overflow:auto;
}
.textbox t {
text-align:center;
color:#8b7d7d;
font-size:15px;
letter-spacing:3px; 
font-weight:bold;
margin:0;
font-variant:small-caps;
}

</style>
</head>

Along with the HTML coding I've used, this is what the homepage looks like.

I'm using the box as a placeholder for where my showreel would be but there won't be a border once the showreel is put in.

I'm unsure about the look of the twitter box at the moment. I'm not sure if I need to get rid of the border there or not.