My Final Piece

This is my Final Dramatic Visualisation.
This demonstrates how people will use the app via video and animation. I use After Effects to create this.

Evaluation

Throughout this project I have learnt about all kinds of things, from accessability to usability.

For my pitch I put forward my idea for this interactive app. And there were some good points and bad points, however there were points raised that I did not necessarily think about, which I should have done. One of these points was colour blindness, for my interactivity I had used highlighted text with red and orange, and for someone who is colour blind they would not be able to this, therefore I had to come up with a new way of having my interactivity and making it in keeping with the rest of the app, and as someone suggested in the 'Crit' session, I therefore placed buttons along each side of the paragraphs, where the user could then click on them to reveal what the interactivity was for each section.

I feel that for this project I could have managed my time a bit better, especially in the beginning, however, when it got passed the initial stages I then got my act together, and came up with an idea and product that I am proud of. I have even e-mailed Peter James himself with my idea, just to see what he says, however, because he is really busy I have not yet heard from him.

The aesthetics of my piece are well thought of and put together, and my interactivity, even though they are minimalistic, I feel for my target audience will be enough to make them want to read on to then find out more, they will also keep them involved within the story as well, which is the whole idea of this app.

Changes I have made due to Crit

Due to the comments from the crit I have made these changes:

1. I have put a settings button - which allows for people to select it whenever they want to either go back home, or make the text bigger.


2. I do not have the loading screen anymore as I did not need it in the first place.


3. Instead of the selected words having a coloured background, on each paragraph I have put an arrow by it, which the viewer can now select it and the corrosponding image will appear on the right-hand side of the screen.


4. I have also placed a small marker - which means when the viewer scrolls the text up, the marker will react to the next scenery image and will appear, so that they are not always stuck on the same image for ages.


5. I have removed any faces from the app - instead I have got (specifically) a police report that the viewer can open and look through, with a pixelated image pinned on the side.


6. Below each of the interactive (non-obvious) sections I have placed a small instruction explaining to the viewer what to do.


7. I have made a new back button, so it is inkeeping with the rest of the aesthetic as the other one brought the piece down.


8. The viewer can now select pieces of the text, hightlight it and then can view it by selecting the favourites button, which is again on every page.

Crit Comments

Has the potential to be a strong idea
Have a settings button on every page of the story
To give people the option to make the text bigger
To allow people to go back to the Home Page
Change the vignette on the Loading Screen
Maybe do not need the Loading Page
Change colours of the selected words and buttons because they will not work for people who are colour blind, they cannot see red or green.
So maybe have an arrow on each paragraph to allow for people to see specific things from each paragraph
Have a marker so that when people scroll up the image changes on the right-hand side.
NO FACES!!
So instead have things like a police report to explain the background or something else that will explain the background of the person.
Have instructions for people, so that they know what to do with the interactivity, for example look around the room (Gyroscope)
Change the ‘back’ button to something that is more stylish like the rest of the app.
As the button now brings down the aesthetic
Have markers (favourites) points for people to go back to pages they like
Maybe allow for people to highlight certain bits of text
Zoom in on location
Google Earth
Have illustrations
Doesn’t have to be interactive on every single page

Interactivity Ideas

Some of the ideas I have come up with are:

• People will be able to click on specific words or names and the corrosponding image or photo (with possibly background information) will appear on opposite side of the screen, adding to story.


• There will be a 'Map' button appear whenever a location name is selected, which means people can select it and a map of the area will appear, this means that people can go and visit the places if they want to.


• On the Home screen there will be 2 other options:

One being Buy the Series and the other being Be A Part of the Series.

• Buy the Series will allow for the user to reas summaries of each of the other books in the series and then gives them the option to buy the book if they want to.


• Ba A Part of the Series, carries on from what Peter James already does, where people can donate money to one of his charities and that then allows for either their name or a chosen name to be in his next up and coming book.

Our Trip to Cogapp (Brighton)

Here are the notes that I took for our visit to Cogapp (Brighton).

• Cogapp explanded from having 7 people to 35 people within the space of 10 years.


• They usually have more cultural clients - such as Museums/Charities/Corporates


• The main body of their work consists with - Web (for Museums) iPad/iPhone (for Corporates)


• There are 15 tech people (no one specialises in just one area, meaning that everyone is able to do everything, and no one is limited)


• They came up with an idea internally (pre-iPad) - for DK Guide Books


• They did say that due to the sheer size of the apps that they find it hard to illustrate what is in the app and how much.


• To make it easier for them, they have made their own processing software, this is so they can all use it, and there are again no limitations.

Here are a few apps (from books) that they showed us:

Quick-Cook app

• There is an introduction of how to use the app


• A filtering system - which means people can select any ingredient/style/for how many people they want (there is an endless number of solutions)


• There is no video content - which brings the size of the app down dramatrically.

Kids Craft

• This allows for children to make things both in real life and on the iPad


• There is an Online and Offline option as well - Online is more realistic looking and offline is a step by step guide (like from the book)

Pregnancy Day by Day

• This is an iPhone app


• You are able to put your due date in - then go through and select any of the different stages that you want to look at.

Digital Photography

• This is again an iPhone app


• This is a step by step guide (similar to the book) on how to photograph different things (objects/landscape/people etc) - and there is a filtering system again, which means you can choose what situtaion you are in, and then the app will show you how to get a great photograph.

USABILITY:

• There is a Usability Department, which interviews people about the app, to see if they are right to test it out.


• The reason for usability testing is then to be able to create interesting and useful digital things instead of just digital things.


• They user test throughout the whole of the design and development process

From the Beginning:

• The one of the most important parts of the whole design and development process is to first get the clients to buy user testing.


• Method of testing - Surveys/Card Sorting (looking at how people organise cards they are given)


• Syncapps - Pearwise Matrix/Broad flow diagram


• Put people into groups (this allows for Cogapp to choose the best people to test the product.)

ONLINE TOOLS (C Inspector/Tree Jack)

• Testing Language/Labelling - to see if people are able to navigate and find things easily in the app

DESIGNING

• Branding Guidelines - Style Guideline


• A/B Testing - showing both designs to one person OR showing one design to one group at a time

TESTING IN CONTEXT

• View it on the device you are designing for


• Axure - Is a testing program (for making a quick app for testing purposes)


• A key expression and Concept we were told is to ask a question to ourselves: IS IT GOOD ENOUGH?


• Make sure you wireframe flexibly


• How to find people for user testing - Databases


• Make sure you have people that are relevant to what you are trying to test - target audience


• Crazy Egg - Tracks where people click and gives hotspots to where they click the most


• Affinity Sorting - Putting coloured post its in relevant groups (for example - User 1 has pink post its and User 2 has green post its etc)

ASK THE RIGHT QUESTIONS

• What is relevant to the project at hand?

SOFTWARE

• Omnigraph (wirefaming)


• Appcelerator


• Unity (Animation)


• Livecode


• Phonegap (HTML)


• Edge


• Prototypes??

ACCESSABILITY

• Apple already have a system to turn text into speech (for people who are blind)


• Keep the navigation in the same place (so people dont get confused)


• Design with intent - Cards By Dan Lockdon and David Harrison.

Designing App

This is all of the scenes from my storyboard.

The design I have based on Peter James' website, however, I have created everything from scratch, using Photoshop and Illustrator.

As you can see there are 25 scenes, for only a tiny app, that is because I have to make every single scene for the storyboard, to allow for the dramatic visualisation to work, as this is based on the storyboard.

However, the storyboard for an iPad app has to be complete for the developer to know what is going to happen, as well as with the notes, which are normally with the storyboard, this tells the developer what needs to happen on every page, and what buttons need to go where etc.

Final Idea

Peter James, with the Superintendent Roy Grace series.



The look and feel I will use his website as inspiration, mainly because the app will then have continuity with the look and feel the author has already got.

This is what the Home page of his website looks like, and for the app I will use the red tag (one that I will create myself), a similar font, and a similar colour scheme, as I feel this would help with the identity of the application.

I really like the way the books are layed out here, it shows how they are all connected as a series because they linking together.

Usability and Constrictions

http://www.slideshare.net/stephenpa/7-user-experience-lessons-from-the-iphone-introducing-ux

7 User Experience Lessons from the iPhone (Introducing UX)

View more presentations from Stephen Anderson

http://www.nngroup.com/reports/mobile/ipad/ipad-usability_1st-edition.pdf

Pages 47-53 is about Affordance: Where can I Tap?

This basically outlines the issues with how big the target has to be to allow for everyone to tap it, meaning you cannot have a tiny target area where only people with tiny fingers can select it, as not everyone has the same size finger, so the best way to get around that is to make the target areas big enough for a bigger finger then you will know that everyone can select that particular area easily.

Pages 86-92 is about Usability Testing

This is basically where they describe the type of people they use and then what they use them for. For this if I was conducting a usability test I would get people who are within the ages of 21-54, male or female, however they have to already know about Peter James, and maybe would have read one of his books. With the other end of the scale I could get people who have never heard of Peter James and never read his books, to see if they would read his books after seeing my application.

Another usability issue that I would have to deal with is people who are colour blind.

http://colourblind.freeservers.com/whatis.htm This is the information I have got from this website:

'There are Three main versions of colour blindness. A red-green colour deficiency, blue-yellow deficiency and total colour blindness. Red-green deficiencies are the most common form of colour blindness. About 8% of men and less than 1% of women have a red-green deficiency.

People with a blue-yellow deficency have an absence of blue cones. This is quite a rare form of colour blindness.
Total colour blindness occurs when a person has no cones, only rods and can see only in black and white. This form of colour blindness is extremely rare.'

This means when I am doing my colour schemes I have to take into account what people will be able to see.

Elaborating on Ideas

Background on Peter James:

Peter James was born and bought up in Brighton, and therefore has a connection with the area. He now lives in a cottage near Ditchling, which is just outside of Brighton.

"In 1994, in addition to conventional print publishing, Penguin published my novel, Host, on two floppy discs, billing it as "the world's first electronic novel." It caused huge controversy, I was pilloried on the Radio 4 Today Programme for attempting to destroy the novel, and I was front page news on many papers around the globe, all equally furious! In the immediate following years I became a media spokesperson for the electronic publishing age, and in 1996 found myself as a keynote speaker at a conference at UCLA on the future of reading, alongside (gulp) Steve Jobs and the CEO of Time Warner!" (http://www.peterjames.com/about)

He also does a lot of charity work for all different charities, such as 'The Backup Trust for spinal injuries, the Martlets Hospice, The Chichester Life Centre, the Book Trade Benevolent Society, Starehe Boys' Centre in Kenya and Action Medical Research.' (http://www.peterjames.com/about)
He also gives people a chance to be a part of his next books, either with a name or a place, by having people donate money to one of his charities.
Using this I can maybe incorporate this into my app, so that after the person has bought the book they can have a link that will allow them to donate money and become a part of his next book.

He has written 19 books and 7 of them are part of a series, which involves a Detective Superintendant called Roy Grace.

1. Dead Simple


2. Looking Good Dead


3. Not Dead Enough


4. Dead Man's Footsteps


5. Dead Tomorrow


6. Dead like you


7. Dead Man's grip

As you can see each of the titles had the word 'Dead' in them, this is a great indictator to which books are part of this series, mainly because with his other 12 books there is only either one or two words as the title, for example:

• Possession


• Deamer


• Sweet Heart


• Twilight


• Prophecy


• Host


• Alchemist


• The Truth


• Denial


• Faith


• The Perfect Murder


• Perfect People

This allows for his audience to tell between the series and his other books.

But just for this project I am only focussing on the Roy Grace Series. This is so, if this app were to be made then there would be a chance for people to keep buying all of the relevant books so they can follow the story all of the way through.

http://www.peterjames.com/ This is where I got all of my information about Peter James.

Interactive Story Ideas

To go against the obvious ideas for this project, I have decided to use my research into who buys iPads more to determine what target audience I will be using to create my application.
Using the research I can determine that my target audience are Adults between the ages of 21-54.

Taking into regards of my target audience I have to think of something that will cover all bases.

I was thinking about using something with comedy, especially pieces that are timely and that everyone will enjoy. For example Monty Python







However, because of the nature of the Monty Python and any other comical film/tv show it will be very difficult to put them into an interactive book. Mainly because they are not a book and therefore do not have any written words for me to follow, and make interactive. Also there is no narrative that I can follow, and then make interactive so that it enhances the audiences' experience. Therefore I will not be following up with the Monty Python idea.

Another idea I had was to do a chapter of Mark Billingham or Peter James. They are both world renowed authors of crime/thriller books. The reasoning for this, is because both authors have a wide range of target audiences ranging from men to women, ages from 21-60, which is the target audience that I would like to aim at.

Out of the 2 authors I am more inclined to go for Peter James because as he bases his books in and around Brighton I would be able to use the georgraphical references as part of my interactive sections.

Research into Ipad Users

As I cannot really decide to to use as my target audience I will do some research into who buys and uses iPads more.
Each of these websites are really useful in telling me about the different reasons why people use iPads and for how long for, as well as other relevant information.

First, is a small article, with statistics, about the iPad, called:
29 Statistics Reveal How The Apple’s iPad Is Changing Our Lives

http://www.jeffbullas.com/2011/04/04/29-statistics-reveal-how-the-apples-ipad-is-changing-our-lives/

iPad’s Time Usage

This has implications on how publishers should be developing content so it is optimized for the appropriate device
Use of desktop computers is down for 35% iPad owners since they bought the device
Use of laptops is also down since they bought an iPad at 39%
87% of owners are using it every day of the week
26% for half an hour to an hour per day
32% for 1-2 hours per day
24% for more than 2 hours a day.

Where do they use it?

Its versatility makes it a flexible and ubiquitous device with
69% of respondents using it in the bedroom
42% in the kitchen
20% of men can’t be parted from it in the bathroom
The last statistic certainly show that men’s habits for reading in the small room have not changed just the device!

What do they use the Apple iPad for?

Accessing the web – 75%
Emailing -63%
53% of iPad owners say they use their device mainly for entertainment
Playing games – 48%
Social networking – 41%
Researching products and services – 29%
Reading books – 25%
Listening to music – 21%
Shopping – 19%
Reading magazines – 13%
For work – 13%
Watching TV – 11%

This next one talks mainlys about Gender and Ages of people who buy and use iPads more, called:
Apple iPad User Analysis — Phase II

http://ymobileblog.com/blog/2010/07/08/apple-ipad-user-analysis-%E2%80%94-phase-ii/

These are the graphs demonstrating that the majority are Males between the ages of 35-44.

This one is the same as the one above, therefore it backs up the information that has been give here.
http://www.macnn.com/articles/10/05/06/early.adopters.mostly.middle.age.men/

http://www.infographicsshowcase.com/infographic-history-of-the-ipad/
This is an image demonstrating everything about sales, buyers, and even changes between the iPad 1 and 2

Lastly this is a brief histroy into how many iPads were sold, in specific months and years.

http://www.ipadinsider.com/tag/ipad-sales-figures/

April 3rd – 300,000 WiFi iPads sold on launch day
April 8th – 450,000 iPads Sold total 5 days after launch, 3.5 Million iPad Apps and 600,000 iBooks downloaded
April 10th – 500,000 iPad Units sold in its first week
May 3rd – 1,000,000 iPad Users in 28 days since launch
May 31st – 2,000,000 iPad Owners after its International Launch
June 21 – 3,000,000 iPads in 80 days

Each of these website are extremely helpful because this allows me to make a decision about the target audience I will be aiming at, and due to the information here, I am going to make my target audience Adults between the ages of 21-54, which is a huge age range, but if I can find a story that will allow for anyone in that age range to enjoy, then I feel that I could break into a market that has not really formed yet.

Research on Wireframes and Storyboards.

Wireframes are used so to mark out when things like images or text will be placed with the application. They are a very simplistic guide, which only uses envelope style boxes, to indicate where images or videos will go, with no actual graphics on them, as well as being very minimalistic they also will not have much text on them, because that is what the Storyboards are for.

This is a website that we have been given to demonstrate what a wireframe will look like.
http://www.slideshare.net/mobilemags/icake-wireframes

iCake wireframes

View more documents from John Walker

With this wireframe, each of the buttons and images/videos are boxes with a cross through them, indicating that there is something going to be there.
This is helpful for me to understand what a wireframe should look like and what it is used for.

After doing the wireframe and then getting it signed off, you then begin to design and make your storyboards.
As stroyboard for an iPad application is not like a normal storyboard, because with an iPad app storyboard you have to design/draw every single page, as well as pages for the interactivity and added extras, so for example if you have a very short story you make have to do at leats 30 storyboards to cover the graphics, interactivity, and multiple outcomes if you had them.
We have been advised to do a flow diagram first if we do have multiple outcomes because then we will have a clear and decisive angle to come from for our storyboards.

After doing the storyboards we then do a dramatic visualisation. This is where we take our storyboard and make everything that we want interactive, and demonstrate how the application will work. There are many different ways of being able to do this, one is to make the whole thing interactive for the user by taking it into Keynote or Flash, and then using hotspots making all of the buttons work and have all of the interactive parts working. Or we can make a film/animation in After Effects, the only down side is that the user will not get to experience the app for themselves, however they will be able to visually see what all of the interactive points are and how everything will work.

http://speckyboy.com/2011/04/26/gui-stencils-wireframing-kits-and-sketching-templates-for-ipad-app-designers/


This is a video demonstrating someone having done a dramatic visualisation in Keynote, and this is how it works after exporting it. He explains also that you have put it onto an iPad to then get other people to see if they can work the app.

Research on Interactive stories

The first thought that comes to mind when I think about a target audience for an interactive story is children. The reasoning for this is because children are easier to please, and therefore I could make a simple yet effective interactive story.

Here are some examples of successful interactive stories for the iPad:

http://reviews.cnet.com/8301-31747_7-20002462-243.html To begin with I found this website which is based on reviews of interactive stories for the iPad.


With this interactive book, I would say that it is aimed at older children and young adults mainly because a younger children normally would not be able to read this amount of text, and would probably get bored easily, however, adults may also enjoy this story too because of the layout and nature of this book, as well as the sophisticated interactive points within this app.
In relation to my application idea, I could use some of the techniques that are used here, especially if I pick a story that will allow me to have these sorts of graphics.


This arrangement of stories are targeted at mainly toddlers or young children who are learning to read and reognise words. Each of these use bright colours, to keep the child interested and alert to the story, as well as using big writing, with highlighted words, which allows for the child to either read the story or have the story read to them. Also the interactive points are easy to find, and in more successfull iPad books, especially for children, the more interactive things you have going on the better, however, the interactive things need to enhance the story telling experience and not distract from it.


With this story, I would say that again aimed at younger children, probably between the ages of 3-6, mainly because of the nature and look of the application. This book down contrast with the other books that I have shown, but I have chosen this because, I want to show that you don't have to have all bright colours to keep the attention of the child. This book is more concentrated on the child's learning and reading skills, as well as having quite a lot of interactivity to keep them amused. The creators have used a white background, emulating a book, with the same layout as what you would see from this author's books. This may allow for the child to recognise the illustrations and therefore want to see what other things this interactive version may have to offer.

iPad Applications for adults:


I have done quite a lot of research into interactive books that are aimed specifically at adults, and as you can see I have only been able to find one iPad book that has been a success. Richard Dawkins - The Magic of Reality. With this book I have found that not every page in interactive, there are some beautiful graphics which help with enhancing the story. As you can see with this first snap shot, everything in this story is animated. There are also games which the viewer can play, which are again relevant to the story that he has talking about.
If I was to do an interactive story for adults, then I would try and reference this book as it is a successful interactive story that is aimed at adults.

Application Tools:


This video is mainly for research, in the respect of what kind of tools and added extras I could have in my book. I think using this video as a guide I could include things that would enhance the viewers experience when they are reading the interactive story. For example, being able to hightlight specific areas, allowing for people to then go back to them another time, when they might need a reference, or if they have a section that they like. I would say that this tool is mainly for an adults book, as I don't think children will appreciate it.

Project 2 - Ipad Design

Brief:

Design an interactive story for the ipad. Take an existing short story and adapt it to be interactive. This can be aimed at any target audience and can be fictional or non-fictional.

Things to do:

• You must consider your target audience and evidence this in your research blogs.


• Prepare and visualize your story so that a developer can interpret your designs and do the necessary coding.


• This will include wireframing (flow diagram) and storyboarding your app, with details of events that need to take place on each page. Your storyboard could be hand drawn/painted, or you could choose to use a digital method to produce your storyboard.


• You will also need to produce a dynamic visualization of your story in order to pitch and demonstrate how it will work.


• You will need to conside why your chosen story will benefit from being interactive; this should be researched and referenced.


• You will need to consider the usability and user experience involved in designing for the ipad, producing samples of user testing handouts/questionnaires.


• You will also need to evidence research into the technical options and constraints that the development of such an app might encounter.

Assessment Rationale/Aims:

Tablets are becoming embedded in the fabric of everyday life; sales have been predicted to quadruple from 15 million in 2010 to 70 million in 2011. It is thought that the iPad will dominate these, selling about 48 million this year and gaining 69% of the market in 2011.

Evaluation and Final Piece

Here is my final piece.

As an evaluation of my work and my process/progress throughout this project I feel, to begin with that in the end I came up with a very simple idea that I think I have executed well and to the best of my ability.

My constant contact with the client allowed me to know that I was always keeping him happy, which at the end of the day means I have met his standards and what he wants out of all of this.

The fact that I have listened to both my peer's and tutor's advice means I have been able to adapt to what other people think as well.

I do feel at the beginning of this project that I was very much stuck in a rut about what I wanted to do, I thought to myself that my initial idea was exactly what the client wanted and needed, and I wasn't listneing to the advice that I was getting, and therefore if I had kept going with my first idea I would not have had such a strong piece at the end.

Due to both the client and my tutors pushing me to do something other than what I wanted meant that I have become a better designer.

Using this, in the future I will listen to the advice of other people, both from the industry and my peers.

My time keeping, I feel I have used my time well, I set myself goals that I have met, for example, when we had to show our work to the client, I wanted to get my work finished so that all I had to do were the changes that were suggested and finessing to make it better, and I successfully made my goal.