DMD: Process Report - Year 2 Semester 1

Introduction

In the first semester of Year 2 we were given a variety of projects. For each task we were given a few weeks to come up with interesting ideas, designs and the implementation of them.

At each project we were divided in different groups, first we were in twos, then on our own and finally the BA-s worked together as a big cohort.

During this twelve week, I developed my skills in Adobe Photoshop, Illustrator and Flash, furthermore I got some basic knowledge in filming and in Adode After Effcets.

In addition, at work I learnt to use Microsoft Share Point 2000 and Cast.

Our first task was the Flash based game project, when the BA-s were working with the BSc-s in teams. During this short project we were asked to discuss concepts and formats for a Flash-based game and to design the visual assets for it. Based upon this discussion, the developer had to write a Design Brief for the designer, who then had to come up with the visuals based upon it.

No theme or topic was given, we could do what we wanted, without restrictions.

The aim of the project was to demonstrate that we developed aesthetic ideas from initial rough drafts to final versions and that the final assets have been aesthetically considered, improved, from concept through to execution.

Bonus points were given for the animations, for creating a very large volume of work, to a consistently high standard; for the ‘rules” to maintain the

“look” created.

We hoped by the time we finish with the project we’ll have a good understanding of the principles of interactive design, especially regarding usability, accessibility and interaction of images, sound, animation. In addition we gained the ability to develop detailed concepts, storylines, characters settings and scripts.

Due to the fact that there were no restrictions, Lisa and I after a short discussion around a possible game idea, decided to do a 2D platform, side scrolling platform game for children. In style and game play it is very similar to the Mario Brothers games. The idea was inspired by Walt Disney’s cartoon Lilo and Stitch.

The game requires use of the arrow keys to direct the character and the spacebar to jump obstacles. Collectables are placed throughout the game, which give the player points. The higher the points collected the better. If obstacles are not avoided, a ‘life’ will be lost.

The team decided to use sound clips when the player collects points, jumps and for other actions.

The plot of our game is the following:

An unknown element has been discovered on Hawaii by aliens from the planet Zgwarth. They send their best scientist, Ed to research this unique X factor which can be dangerous. His mission is to keep element X safe.

Meanwhile on Earth, a local Hawaiian scientist called Edwina does some research in the forest and discovers something strange, element X.

Soon he meets Ed who explains the situation to her. They team up to protect Earth from X.

Other aliens from planet Ypuio find out about this so they send a troop of TT-s ( Total Terminators) to invade the island. They capture Edwina.

Ed has to save her and send the TT-s home.

We wanted a really good sounding name for the game which would sound mysterious at the same time. First we thought of Ed and Edwina, The Eds and so on, but finally we opted for Element X, because we thought this is intriguing and it would draw children’s attention.

We debated on the two good characters, the good alien and the scientist as well. The initial idea of the whole game was inspired by the cartoon Lilo and Stitch, where an alien flees to an exotic island where he meets a girl. After many adventures Stitch becomes friends with Lilo.

We had two choices for Ed, one was to make him an animal (like Stitch looks like a dog) or rather like a robot, for example Wall.E. In the end I opted for the combination of the two.

Edwina was first meant to be a princess, but then the story made no sense, so we chose her to be a local scientist.

Since the whole game had to be aesthetic, the bad aliens’, the TT-s (Total Terminators) appearance had to follow the same style as Ed’s.

The game constitutes of four levels which are the following:

Level 1: Beach

Level 2: Forest

Level 3: A house in the forest

Level 4: Spaceship

Media Player Project - Peacock

In our second project the BA-s were required to design a Digital Media Player.

This task had a very open brief. Its goal was for us to show how well we can identify a strong original concept and carry it through to final design.

We had to come up with visuals and animations that explain the designs very clearly to the audience. It had to be evident how things work and why, without a verbal explanation.

After creating the visuals I then had to present the media player to the audience where I had to explain the design decisions I made, the thinking behind my proposed solutions. I had to sell my design to the audience based upon its advantages and unique selling points.

The brief was to “break the mould”, break new ground. Instead of concentrating on the usability and accessibility, we had to focus on originality. We were asked not to use Tabular / List views, because they are exhausted designs.

It’s a fact that Digital Media Players are heavily influenced by the iTunes and Winamp, but we were prohibited to create another iTunes clone.

To meet the requirements we had to think hard about what information must be displayed, how and why it needs to be.

According to the brief, my task was to present a set of images detailing all of the mandatory features of the digital media player. The brief also states that I had to present at least one animation, created in Flash. The purpose of this is to clarify aspects of my player that can’t be explained through static images alone.

There were three mandatory features set for my media player:

It had to have a library view that displays an Audio collection for browsing by the following fields: Artist Name(s), Album Title, Genre(s), All Songs.

The player also had to include a visualiser that reacts in realtime to the

Audio being played, and what is shown, how it reacts (volume)

The last feature was the playback controls - to start, stop, pause, skip etc whatever is playing.

My first idea was to make a Jukebox, but after a discussion with Lesley, she insisted that I should look for other inspiration. She told me a story about how her uncle designed a logo with the help of triangles. Her story reminded me of my grandfather who used to collect peacock feathers. At home I started looking at images of feathers and realised it would look great as a media player.

I decided to call it Peacock, because its simple but sounds good. These birds represent vanity, so my target audience are women. As a theme I chose purple and pink, but I thought it could have a setting option to change this.

My fist step was to draw a sketch and to come up with the playback control, which is the feathers head:

The inner pink oval is the Play/ Pause button.

You can skip to the next or previous song by turning the white oval left or right.

The exterior purple part is the Stop button.

The bottom of the stem is the volume control which disappears after setting it to the right level.

The branches of the feather are the library where the Artist’s name can be found from A-Z. If you click on one of them, the branches will show the albums. After another click on one of them, the player will show the tracks. While playing, the branches would fluctuate. When the user wants to change artist, she has to click on the ball at the end of the branch, which will take her back to the album. If she clicks on the ball again, it goes back to the albums list, if she click again the player shows the A-Z list.

New albums or songs can be added to the player by drag and drop.

Marketing Promo Video Project

In our third project, the BA group was given the task to create a marketing video promoting the course. In this 6 week project it was required from each of us to choose to do one or more sub element that is part of the main project.

It was required that the video should be composed of interviews with students and lecturers, intro and credits graphics, music for the video, End of Year show reel and viral for use on the different social media platforms for promoting.

The style of the video is animation combined with live footages. It includes sound bites of the interviews with the students of the course; showcases the work along with animation and kinetic typography. The duration of the video is less then 3 minutes and it consists of three parts:

The video shows Winchester (King Alfred statue, the Cathedral and the high street) followed by the campus, Student Union, Learning Café and the University’s buildings.

Animated interview with Lisa, Chelsea and a first year BA.

The show reel with our work.

In the last part a board comes up inviting people to attend the open days or visit the website.

With this video our aim is to be visible to the digital media industry, attract their attention towards our group.

Your tasks and milestones

At each project the first step is to map up the things that need to be done, distribute the team roles and split up the work

Flash Based Game Project – Element X

We prepared the story board for the first level, where the assets are placed. An introduction screen was also needed that includes the game title and a graphic as wells as the ‘click to play’ button which gets the game started.

A second screen was also needed that includes a short explanation of the story and simple instructions such as use the arrow keys to move and the space bar to jump.

The story is told through stills. Furthermore a closing screen was also required for the end of the level which would lead on to the next level or reflect the number of points that the player has collected.

The beach background for the level had to be carefully designed by both sides so that the graphic appears to seamlessly scroll.

There were added additional images to the foreground and background such as a net, shelves, palm tree, seaweed, a log. These are the obstacles which the player has to jump over.

The level required Edwina the scientist, Ed the good alien character and the bad guys, who are obstacles as well.

The characters had to be animated as if walking and jumping accompanied by a still image.

Collectables provided for collection throughout the level along with Element X that the player receives at the end of the level.

At the top right corner a graphic shows the feedback when the collectables are picked up, the lives left and ‘-1life’ if the player runs into a bad guy.

I created the characters, their side views, the opening and end screen using Adobe Illustrator, afterwards I animated Ed and TT using Adobe Flash.

Ed was simple to draw, he’s made of circles and his ears consist of curly lines. TT was made by putting a lot of triangles on a circle, which are his spikes.

I made a sketch of the background, then used Illustrator again. I put al of the elements in one, but on different layers, so they can be switched off when not needed.

Media Player Project - Peacock

Throughout the design process I used Adobe Illustrator to create my Peacock player. First I downloaded an image of a peacock feather as a background. I decreased the opacity and started drawing on top of it.

First I just drawn circles, then the stem, and the branches. John showed me how to use the pattern following text tool, which was useful for listing the songs.

After doing so, I imported the images into Flash and started animating. I wanted the branch to wave, but because I didn’t know how to do it, I just moved it up and down.

Marketing Promo Video Project

The first step of the group was to assign the work, so we decided that David is going to film Winchester and the University; Alex is going to do the show reel; Orsi and Chris are going to do the interviews; Sammy will be in charge of post production; Chelsea will be the chief animator.

With my Samsung NV100 HD camera, a tripod and with Chris as the interviewer we shot the interviews. I handed them over to Sammy who edited them as the way we needed them to be.

We divided the answers to be animated using kinetic typography. I was doing Lisa’s third answer. Chris and Alex were doing the others and Chelsea animated herself.

This summer I already practised kinetic typography using Flash, so it wasn’t as hard as I imagined.

The sentence I had to animate was:

“My favourite aspect of the course is working collaboratively with the BA-s which you wouldn’t get the chance to do in industry.”

I had great fun playing the words. I made the word “collaboratively” move up and be stopped be “working” so it wouldn’t fly out of the stage. I also played with the “BA-s”, changed the colour of the letters, to make it look like it is flickering.

Achievements and challenges

Flash Based Game Project – Element X

At this project my work was to create a good alien, Ed; a bad one, TT and a female character, Edwina. This was followed by creating the background and the obstacles. I enjoyed this project, because I like drawing exotic beaches and cartoon characters.

My only challenge I faced during this project was getting the work done on time, because I’ve been away for a week.

Media Player Project - Peacock

In this project my work was to design and create a unique media player.

While doing this I learnt more about Illustrator, about the Text tools it has.

My only challenge was that my animation wouldn’t stop, it looped. I showed it to Lesley and she pointed out that my code wasn’t right. After correcting it, it worked as I wanted it to be. She also warned me to pay more attention on the bits that need to be hidden in the background, some of the branches hang out of the stem.

Marketing Promo Video Project

In this project I was the cameraman. John booked a session for us how to use the camera, the green screen and the lights, but when we tried using it afterwards, we found it difficult. Because we were running out of time, I suggested we should use mine, because it would make our situation easier.

Time management was one of the main challenges we had to face, we should have started working on the project straight away, have the camera training first on the first week. The other obstacle was that many of us didn’t know Adobe After Effects or Final Cut Pro. Because I wasn’t sure of it, I did the kinetic typography using Flash.

I would have liked to contribute in the post production, but because of lack of time and knowledge, I felt I couldn’t

Your role as a team member

Flash Based Game Project – Element X

Lisa Cripps was the team leader, she wrote the brief and I followed it. We got along well, agreed in everything, came up with the ideas together. Lisa’s job was to create Element X in Flash.

I was the designer. My job was to create the visuals for the game, the characters, beginning, end screen, design the background and the collectables.

Media Player Project - Peacock

This was our first project where we got the opportunity to work on our own. The only disadvantage of it was that there were no team members to discuss issues, give ideas.

Marketing Promo Video Project

In this project the whole BA group had the chance to work together as a big cohort. Some of us found it strange, because there are 7 of us. In the end we managed quite well, we prepared a collective written proposal before we knew it should be individual. We tried to help each other as much as our abilities let it.