LO2 - Be able to initiate, plan and design a new interactive media product to a client brief

 Task 1 – P2 – Mindmap of Initial ideas.

You will create a mindmap of initial ideas for an original interactive product (website). You can create the IP for anything, whether it be a client (as Unit 20) or an online portfolio of your own work to take to interviews. You should look to have a minimum of 5 possible ideas on your mindmap. 

Interactive Media Product Ideas

Idea 1:

Art - 

• Commission
• Tutorial
• Brush packs
• Supplies

Idea 2:

Cosplay -

• Recommendations
• How to start
• Best websites
• Conventions

Idea 3:

Game recommendations -

• Genre
• Age
• How to play / gameplay
• Game overview

Idea 4:

Book Recommendations -

• Genre
• Style
• Overview 

Idea  5:

Sheffield Events -

• Out of this world
• Conventions
• Meet and Greets

Task 2 – P2 – Synopsis of 3 ideas 

You will write a short description of 3 of your mind mapped ideas (50-100 words each) explaining briefly what each product’s purpose would be, who the audience would be and how it would incorporate interactive features. One of these MUST be the one you have chosen to produce. 

Art:

For this idea, the purpose would be to inform/teach and entertain an audience. This would mean that my website includes tutorials and different starter ideas for the viewers to help them. Another thing my website would contain is brush packs or recommended tools to make art smoother. The website will also contain a commissions section where it will explain the prices for different art that can be viewed on the website. Overall, the website will mainly be tutorials for the viewer or a portfolio of my art.

Cosplay:

The idea that i have had for a cosplay themed website is to give different tips or tricks for starting cosplayers. This will mean the website will also include site recommendations for cheap or expensive cosplay. The pictures that will be uploaded to the website will include different styles of cosplay. For example, one cosplay will be from a game but another featured from a show.

Book Recommendations:

This type of website gives me a wide range of things i could do. Firstly, i will include different genres of books to separate the website into sections (making it easy to navigate) . Then i will recommend books depending on the genre. However,  there are different style of books such as text books, comics, manga etc. So, my website will include a variety of these.

Task 3 – P2 – Detailed Treatment

You will now write a detailed treatment for your chosen interactive product. You will include details of the following information:

 • An overview of what the product is.

 • An explanation of its purpose

 • Who the intended target audience are

 • What interactivity will be included 

• What assets (images, videos, text etc.) you will need to create the product

 • What resources (Cameras, Software, Computers etc.) you will need to produce the product. 

• A simple production schedule

 • A simple plan for user testing. 

Chosen website theme:

Book recommendations-

Treatment-

The website would be a quick and easy way for readers / book lovers to find some good recommendations for the favorite genre. This is also a way for them to explore their different book tastes. The purpose it to entertain an audience (specifically bookworms) and help them find new content that they can read. It's also a way for people to find genres without going through long google searches. My intended target audience is a wide variety of people as reading is for everyone. My recommendations will be 16+ so no children recommendations will be featured in my website. Specifically, my target audience is 16 - 40 as i won't be recommending older books for people 60+ (if that is what they are interested in). The interactivity that i am going to include is options for genre of book and style. An example of this would be genre: Horror, style: Comic. Iv'e decided to do it this way because it will make my website fully functional and it will be easier for a user to navigate. This is also makes it easier for me to widen the variety of books i can recommend. As for the assets, i will only need images of the front and back cover of the books i will be recommending and text to explain the overall story / plot and if it is well written etc. The resources that i will need to make the product is a computer, camera and editing software to edit photos that are taken. I may also need PowerPoint or word to plan out the making of my product.

Unit 4 - Production Schedule.xlsx (sharepoint.com)

-Link to the production schedule

Note

This does not include deadlines as of right now.

Task 6 – P3 – Risk Assessment 

You need to create a risk assessment for the creation of your media product. This should cover creating any assets also. Use the table format below to assist you.

Task 7 – P3 – Design Wireframes 

You now need to create wireframe sketches of your designs for each page of your interactive product. Where possible these will include information on : 

• Font Styles 

• Colour Palette 

• Use of Media (images/video/sound) 

• Navigation You will produce a wireframe sketch for each page planned for creation (use the site map as reference)

Home Page:

Font:

This page is the one that will appear first when the website is opened so the text / font should be easy to read and see so that it is accessible to all users.

Colour palette:

I want this page to feel cozy to an audience / viewer as it is the main page and the page that will make the first impression and represent the rest of my website.

Use of media:

For this page i have used image and sound media as it will make my website more appealing to my reader. I have used images for each genre to show their icons and make it easier for a user to navigate my website. If it is possible I have two ideas for the use of sound media. My first idea is to have background music the users can toggle on and off. The second idea for sound is to have sound effects when a user clicks on a link or an option (genre, home, profile etc)

Navigation:

A user can navigate this page by simply moving the mouse over an image or piece of text to redirect them to their chosen options. For example, if a user navigates to a specific genre then they will be taken to that genres recommendations.

Search Page:

Font:

The font on this page will be the same as the main page because it will look out of place and i want this page to look as though it belongs with the main page (shows its the same website and sticks with a theme)

Colour Palette:

I want this page to have a somewhat neutral colour scheme as all the genres have very different colour schemes which coordinate with their themes. Because of this, i will use pastel / light colours to make them clash less, this will also make the website look less 'busy' or overdone.

Use of media:

For this page I want to use images to show the different genres. This just makes it easier for a user to navigate the website and understand what each section does. I did this because I don't want the website to look full on information (writing) only, it makes it hard for users to understand the part so the website. This also allows me to add colour to the page and compared to the other images it'll look nicer and more thought out.

Navigation:

This page will be simple to navigate, all the user has to do is click what they want then type what they are looking for. If done correctly what they search will come up and they can be redirected from there.

Profile Page:

Font:

The font for this page will be bold serif as it needs to be clear for the audience to see and read because this page is important to the audience due to navigation and progress saves. The text will be kind of large due to the lack of writing and information on this page.

Colour palette:

The text will be all black, however there will be some colour on the page for the profile picture and the background. My initial idea for the colour is a light red because the text will still be easier to see this way. My second idea is just sticking with white as it'll match the rest of the websites pages.

Use of media:

There will only be one image on this page and that'll be the profile picture as there is no purpose for any other images or videos to be added.

Navigation:

Users should be able to interact with the profile picture and other options simply by pressing on them, however to upload a profile picture a user must upload an image from their camera roll or files.

(Note: if this doesn't work the backup plan is to keep the profile page but miss out on the pfp uploading)

Style Page:

Font:

The font for this page will match the rest of the pages as it needs to be simple and easy to read for all users because this is the page that gives information on all the different types of books which is important info for a reader.

Colour palette:

For this page, I will be using white for the background (or light red like the profile page) and black for the text as the theme needs to stay consistent. A user needs to recognise each page of the website as I don't want my website to look as though it was made by different people for different purposes.

Use of media:

I don't plan on using any images for this page because it'll take up space that is needed for text, that and it's not necessary for any of the information and won't be needed

Navigation:

Like the main page, the style page can be used to find genre and styles of books as intended and all users have to do is click on their desired genre / style to be redirected to a page based on their chosen genre. Users will be able to return to the home page if needed by simply clicking the home page icon.

Genre Page:

Font:

A simple serif font will be used for this page again to match the rest of the website, that and users need to understand what the text says s it must be simple. 

Colour palette:

This is the page that will likely have the most colour. For each genre I will use colours that best connote it, for example: I will use a purple for fantasy as it is considered a 'royal colour' (or rich) so it fits that genre and makes it easier for the audience to associate them.

Use of media:

As for the media, I will be using images for each genre of book that is featured on my website. This will be the same as the hope page, except it has more information or it includes more genres than the home page features.

Navigation:

This page has much information for a user to look at, however it's just a more in depth version of the main page as it includes a bigger explanation to the genres and what they include. To navigate this page, a user must click on their desired genre to find their wanted book recommendations.

Overall, each page is navigated the same, click what you want to look further into and boom! your content shall appear :)

Task 8 – P3 – Asset List

You now need to create a list of assets for use on the website. You need to attribute for each:

• The source of the asset (where you got it from)

• The type of asset (image, video, sound etc.)

• Where it will be used on the site

• File format

• Where it is stored

Source: Google under 'Creative commons license'

Asset Type: Image

File Format: PNG

Stored: 'Icons' folder on OneDrive and computer

This icon can be found on the main page of the website, it will be under 'Horror' and it's there to represent the genre. For example, in this case, the ghost is associated with horror and being scary.

Source: Google under 'Creative commons license'

Asset Type: Image

File Format: PNG

Stored: 'Icons' folder on OneDrive and computer

This icon can also be found on the main page for the website and this represents 'Action. It's a gun because this represents this genre well as scenes are usually action packed when guns are involved.

Source: Google under 'Creative commons license'

Asset Type: Image

File Format: PNG

Stored: 'Icons' folder on OneDrive and computer

The wizard hat icon is on the main page of the website or the home page. It  is there to represent magic and fantasy. Wizard hats are typically associated with magic and supernatural abilities which is why I used it for this genre.

Source: Google under 'Creative commons license'

Asset Type: Image

File Format: PNG

Stored: 'Icons' folder on OneDrive and computer

This is the last icon that I have used for the genre section of the main page and this icon is to represent romance, with it being two hearts it fits.

Before importing the icons, I have checked the license and if I can use it for my website which I can, and then I put icons into Photoshop where I removed the background using the background remover tool. After this, I went in with the eraser tool and made the edges smoother.

Task 9 – P3 – Initial test plan 

As part of your planning you need to create an initial test plan which shows what you think will need testing in the product when complete. This will cover navigation, interactive features and any other point where a user expects a response from the product. A simple format for this is as follows

Task 10 – M2 – Legal & Ethical

You will discuss in a blog post the legal and ethical issues to be considered in the creation of the product. This must link directly to the creation of your chosen product. You may wish to consider: Copyright & fair use, permissions and release forms, use of language, treatment of models, representation of minorities etc. depending on the planned content of your interactive product.

Legal Issues -

Libel and Slander - I should not write about the author and what legal issues of scandals that they could be involved in as this may cause issues for my website and the legality of it. 

Disclaimers - If any book or genre contains themes / subjects that may be triggering, upsetting or overall inappropriate of a user, there should be a disclaimer stating so before a user continues to browse the website.

Copyright - Any images or media that is used on my website must be checked for copyright before being uploaded. If I wish to use copyrighted content, I must gain permission and have proof of it.

Ethical Issues - 

Biased Opinions - Reviews being even and not biased. For example, I should not favor one book over the other based on personal opinion as this may alter peoples thoughts on the book and damage an authors reputation.

Misinformation - Any information contained in the website should be true and not misleading. For example, any book description should be accurate to the actual story.

User tracking preferences - The website shouldn't take / collect information that the user has not granted permission to take.

Advertisements and Originality - The website should not be a copy of another website, nothing should be stolen, copied or ripped off. Content should be original and true.

Lo1 - Be able to compare interactive media products

 To start Unit 4 you need to analyse a range (3-5) of different Interactive media products e.g: websites, apps, games, information points. Anything where the user interacts with a DIGITAL interface to make the software work. 

Task 1 – Pass Criteria. You will spend some time accessing these products and complete a report which explains:

 • What the products are and what their purpose is.

 • What features each product have and how it uses these to engage its targeted audience (e.g. customization).

Suggested media products:

The Pottermore website (wizarding world):

This website is an interactive product for fans of Harry potter where they can buy merch, interact with other 'students' and take quizzes to find out their Hogwarts house. The features that make this product engage with the target audience is how it treats the target audience (Harry Potter fans) as if they are actually in Hogwarts as a student. They also have customisation options for the students so they can choose their house, uniform, hair, face etc. They also have a variety of customised merch for fans to buy such as an official Hogwarts acceptance letters or links to Harry potter world.

Dumb ways to die (app):

This apps purpose is to inform and entertain a younger audience about the dangers of life and the consequences that come with doing dumb things. It uses humor to 'wash down' the violence and make it more appropriate for children. The main focus is to bring attention to Metro Trains in Melbourne to keep children safe when hanging around trains. The way this app interacts and targets an audience is by allowing them to play 82 different mini games within their game. Another product they have made is a YouTube music video featuring the song 'dumb ways to die' where is goes through many dumb ways to die. They have a collection of characters which are obtainable via the in game mini games and through tasks.

The Last Of Us (Game): 

This is a story based apocalyptic game and the main purpose is to entertain the fans of the game. This game includes a multiplayer where the players can pick their faction between fireflies and hunters. This option especially engages the fans as it relates back to the original plot of the story section of the game where the two grounds rebelled against each other and fought. Another in game option is the customisation of the character where you can choose the hat, mask, gesture and emblem. There is also a  feature where you can make custom load-outs with guns, perks and purchasable's. The Last Of Us has also been recreated for PS5 to improve the graphics, quality and overall game play. Lastly, the game has had a series adaptation along with trailers for both the series and the game which encourages the fans to interact with the other products. Players can also change  game graphics and options such as subtitles, lighting and gore.

BBC Sounds (website):

The purpose of this website is to entertain ad inform, it includes different podcasts, playlists and music for a user to listen to. They have different categories such as podcasts, drama, comedy, true crime, sports, classical and much more. There are more specific options which include episodes on their page such as music mixes and the proms where users can choose an episode to listen to. It includes a wide variety of artists which make music and content for an audience to listen to. To become more interactive with their listeners, they have a section of the website for the user specifically which is called 'my playlist' where the user can add to their list of 'to watch'. Another option for the user is to subscribe to the website  for updates.

Netflix (TV App):

The purpose of this app is to entertain an audience by giving them a wide variety / genre of films and interactive media for them to watch. This app allows users to watch a film or series without any effort or they have added a function in which users can watch 'interactive; shows where they can make decisions in a show to change the outcome of what happens next. Sometimes this can be a show with real actors or be game based. An example of this is 'love choice' or 'Minecraft: Story Mode' Asides from this, the app also allows users in the same home to share the same Netflix subscription, something that comes with this is a multiple account option where users can make multiple accounts relevant to them. A customisation option in this app is to change the age rating and set restrictions for their children so they aren't subjected to content they shouldn't see. Finally, Netflix targets a diverse variety of people, this is because they target everyone specifically based on the content they interact with using their app. This means the recommendations will change or vary depending on a users interests, despite this they also have a relevance rating out of 100% which will hint to a user if they will enjoy content they have clicked on or not.

Task 2 – Merit Criteria 

You now need to show an understanding of how the platform (PC/Mac/Console/Phone/Tablet) that you access the Interactive Product with changes (or doesn’t) the user experience. This needs to be very clear and explicit describing: 

• Any visual changes 

• Any Input changes – How the user gains response 

• Any Content change 

You should focus on how the change in platform causes these changes and what effect that may have on the user/target audience. For example: A user playing Minecraft on a PC platform will have a different experience from a user playing the same game on a phone. The screen is smaller, the control system is different, the visuals of the game become harder to see and so on.

The Pottermore website (wizarding world):

Visual Changes: Layout of website where users see things

Input Changes: 

Content Change: N/A

Dumb ways to die (app):

Visual Changes: The games visuals don't change when you play on PC, tablet, phone or console. The only change would be the size of the screen which depends on the type / model of  the device used.

Input Changes: A change between tablet + phone compared to PC is that the users must click, tap or drag the screen to gain a response from the game. However, on PC the game must be played using a keyboard and mouse to gain a response and beat the game.

Content Change:

The Last Of Us (Game): 

Visual Changes: N/A

Input Changes: N/A

Content Change: N/A

BBC Sounds (website):

Visual Changes: A difference between the website on PC and the website on a Phone is the hotbar on PC is easily accessible compared to phone where it is hidden. This means its easier to navigate on PC since the content is in front of you and not hidden behind other buttons or options.

Input Changes: When using a phone on this website, you must navigate the website by dragging your finger along the screen or using the 'Menu' option to get the option to see different sectors of the website such as 'Home' 'Music' 'Podcasts' and 'My Sounds'

Content Change: The content stays the same, you can still access the genres and media.

Netflix (TV App):

Visual Changes: The visuals stay almost the same, on a phone and tablet the buttons become smaller but that is due to phone size.

Input Changes: On a phone, you must click the buttons on the screen to tap and choose the content you would like to view or watch, however on a PC or TV you must navigate with either a keyboard and mouse or remote.

Content Change: N/A