Overcoming Software Restrictions

Designing my iBook through live editing that consistently updates on the iPad to allow me to check all new elements and make decisions based on the appearance of the iBook on it. 

I just wanted to give a quick update of where I am in the project.

I'm currently building my iBook in iBooks Author. I have chosen a design that I want to settle on, so am loading those into the software and overcoming problems with sizing and the restrictions that iBooks Author has.

I understand that iBooks Author is designed to be as easy and essentially fool-proof for anyone to use, you just replace their content with yours and tah-da! there's your iBook, but when I'm trying to design something a bit more complex it's near impossible. I've had to simplify my design and reconsider how the book shall read.

A restriction that I've found is with the 'Table of Contents'. If I had it my way, I would remove it. It's annoying and just doesn't feel very user friendly for someone who is new to using iBooks. My initial plan was to have just the one contents page, with links to each of the 4 chapters incorporated into the design, which can then be navigated back to from anywhere within the iBook. This, however, has not worked out.

My initial plan for the design of my one contents page

iBooks author requires that you have a separate contents page for each chapter, which you are presented with at the beginning of the iBook. Like below.

Chapter 1                                                                                       Chapter 2

In order to overcome this, I needed to overhaul the way my iBook navigated and redesign the pages that navigate to each chapter. I went back to my sketchbook and sketched some ideas, and then attempted the following design.

One of the first problems I came across was the way the contents page for each chapter displays a preview of all of the pages in that chapter along the bottom of the page, so it obstructed the design of the page and I did not like the look of it.

So, I then had to re-shift the border of the page so that it appeared above and around that area where the thumbnails would appear. I just preferred the look of it and it provided a clearer backing for the thumbnails to stand against. Also, there's nothing in my design that overlays anything else, so by having a relatively transparent rectangle laying over the top of it it did not match the design style.

This meant reducing the amount of the volcano that was visible, but I'm not too bothered by this as I think the lava that I have drawn that comes out of the top of it makes it clear enough that it's a volcano. 

Back to the re-design design of the Contents pages. I was aiming for an alternate left-right-left-right on the content links as I felt it would break up the continuous repeat of having each page designed exactly the same. So, I designed the following pages.

So, I imported this and then started formatting the titles that would appear on each page and positioning them where I thought correct. Whilst doing this I discovered that if you move one thing on one page, e.g. the Chapter title, it moves it on all of the other contents pages too. This meant I couldn't have alternating positions on each page and would need to settle for a design that was the same on each page. I stuck with having the text on the right hand side and the volcano on the left and decided on alternating the colours on each page instead. 

I've now started to import all of my content into my iBook.

Analysing iBooks

To do some more research, I'm going to analyse some existing 'enhanced' and regular iBooks. This should help me gain some understanding on what makes a successful iBook and what doesn't, as well as further identify any conventions and patterns throughout them. I viewed them on my iPad, to see the full experience the iBook gives. Screenshots are direct from the iPad.

'Our Wild Planet'
The first iBook I analysed was one that was not enhanced, but very similar to what I've been asked to do. It's an information book about different types of animals, with different chapters explaining different animals that fall into different categories within each.

Our Wild Planet - Nature Through The Eyes of a Project Noah Community

This is the very first page you see when you open the iBook. You can see that the bottom of the screen contains a row of dots. Each of those dots represent a chapter, and then within that chapter there additional sections with their own pages. In the above image you can see I am in Chapter 1, Page 1. Below you can see how when you scroll through the different chapters, each row of images (previews of what's on that page) changes. 

Once I had delved into one of the chapters, I noticed an obvious recurring theme about all of the pages containing content - they're all pretty much the same! There seems to be very little difference between each information page, no matter what category it may be in - a page in the 'birds' category is the same as a page in the 'mammals' and then the same as one in the 'anthropods' category.

The above screen caps are from the 'mammals' and 'birds' categories. They both contain a portrait image on either the far left or right, with specific styles for the heading, subtitle and body text. To me, this is quite a dull way of presenting information. It does not look that interesting. The black font against the stark white background is too text-book-like and despite the small chunks of information, I don't think this provides an easy way to learn. 

There are points, though, randomly throughout the iBook where there is good positioning of text around images. The images are large and cover the entire page, forcing the text to work around it. In some areas it works, some not so much, but I think it's a much more successful way of laying out the information. 

Example 1                                                                             Example 2

Example 1: Relatively successful. Good use of a large image, and the darker text works well with the green. 

Example 2: Excellent use of space around the main subject of the image & well coloured text that is very readable against the green background. Your eyes travel around the entire page.

There is no interaction in this iBook, it's purely for reference. You can easily skip to and from chapters, and using the iBook app you can take notes along the way and view an outline of the entire book. You can see below the toolbar you use the navigate, and the notes/summary page.

--------------------------------------------------------------------------------------------------------------------------

'Visual Dictionary - 11 Languages'

Next up is this pure interaction based iBook. It's an iBook that teaches foreign languages and, in the same, the words for different items in an airport. There are only two types of interaction - swiping from page to page, and sound upon selection of images. I recorded a short video of how you interact with the iBook.

I think the lack of varied interaction works in this iBook. Whilst I only download the sample version so I haven't seen the entire thing, I do think perhaps a small bit of more information could be included. Either an introduction screen or a small piece of text on each page.

Compared to my previous analysis, this iBook is much more reliant on the users common sense and whether they understand that they can click on an image and it will play a sound. Small sound icons may help to ensure that people get the full experience from it.

The graphics are very simple and easy to understand. The title of the book contains the word 'symbols', so the iBook itself uses very recognisable 'symbols' that are generally understood as signs worldwide. 

As you can see above, no matter which page or chapter you're on, or which language you're trying to learn, the page layout stays exactly the same. This provides great sense of continuity and makes it extremely easy to navigate, but does look a bit dull after a while. Perhaps an inclusion of the countries flags somewhere? May help. 

iBooks & iBooks Author

I want to find out a bit more information about iBooks and the software that I'm going to be using in order for me to start generating ideas and develop my brainstorming further. I am interested in doing some brief research into iBooks author as the results should allow me to distinguish how much scope I have to play within the program - is there any thing that the program isn't capable of doing?  What scale of interaction can I go to?

Alongside doing this I'm now starting to gather the content for my iBook under the category 'Volcanoes'. I am so happy I received this category! It's something that when you first hear it, it immediately sounds interesting and now I'm doing some initial research into it.

iBooks Author
iBooks Author is an application created by Apple to enable anyone to make their own iBooks and submit them to the Apple iBook store. They can be ready on iPhones, iPads and Apple Macs.

As well as allowing you to do the obvious - put text and images on a page - iBooks Author allows the user to 'interact' with the book to a greater extent than the regular iBook may allow. iBooks that have interactions in them are referred to as 'enhanced' iBooks.

According to Apples information page on iBooks Author, it's capabilities include:
http://www.apple.com/uk/ibooks-author/

- Use of prebuilt templates

I'm about 80% sure I will not be using a prebuilt template, as I would design my iBook from the ground up within their software and then design individual elements. I need to start looking into design styles.

- Add text
- Add shapes
- Add tables
- Add charts

All basic. standard elements, similar to Apple Keynote.

- Add widgets

The widgets panel in iBooks author

Widgets will allow me to implement significant interaction and animation into my iBook to help strengthen it and make it more interesting

Widgets include: importing Keynote presentations (which can include animations themselves, built within Keynote, interactive images (zoom into them, pan throughout them), image galleries (navigate through a set of pictures without having them all on the page), scrolling sidebars (allow users to briefly browse a side note without them leaving the page), 'pop over' (clickable points on an image where more information can pop up in a box), add media (add video & music and embed from external sources e.g. YouTube), chapter reviews (option to create a multi choice quiz at the end of a chapter to enable the user to check what they've learnt), 3D images (ability to view a 3D image from all angles, with added controls to navigate), and the ability to add your own HTML models. 

There is also option to choose between a Portrait or Landscape iBook. I'm likely to be going with Landscape, as it seems more of a natural way for someone read - kind of like a double page spread in a magazine - and will give me more scope to experiment with page layout as well as use larger images/graphs/interactions etc.

Now I've looked into what the software I'm going to be using is actually capable of, I can ensure that whilst brainstorming and developing ideas I am not planning to design & create something that is impossible to pull off within the means I have.

AF106: Interaction Design

New brief time! This assignment is focused more on Interaction Design; specifically iBooks.

The task is to create an iBook for Level 3 students (A-Level) that can be used as an educational resource. It's to be constructed on iBooks Author to be used on the iPad.

As the iBook will be used an 'educational resource' all of the information included in it must be factually correct - this means using reliable sources and adhering to copyright restrictions in the same way you would when writing a report.

In order to make the iBook more interesting and engaging and bring the subject to life, it must be Interactive (e.g. the 'i' in 'iBook') and of a 'documentary narrative'. So, it must be presented in a reasonably formal way in some form of narrative. The chapters and articles should run from each other and the iBook should also have the ability to link to pages back and forth throughout.

The subject of the iBook will be a "wonder of nature".

My subject is: Volcanoes

The iBook must be built out of a frame of 'robust navigation', so this is an element I will research and explore further throughout the assignment. It must contain a combination of text and images, as well as video and sound files. All of these must be sourced and then put into an asset register. 

The asset register must detail the sources of each asset with information on copyright restrictions.

In order to conduct my research, I must find and analyse examples of iBooks and Animated elements that are part of an interactive navigation structure. As well as this, I must conduct visual research which will help me develop the design, interaction and navigation of my iBook.

My pitch to the group must contain examples of research, mockups, storyboards and my plans for the navigation of my iBook.

To hand in submission:

• Pitch
• A folder containing
• iBook Authoring File (.iba)
• Finished exported iBook
• PDF render of finished iBook
• Working files (in a folder)
• Asset Register
• Production Schedule with intervals
• Sketchbook

The sketchbook and this blog must contain:

• Evidence of research
• Preparatory work
• Final Designs
• Evidence of a developed understanding of technical and design issues
• Evidence of a developed understanding of interactive design principles and practise.
• Evidence of user testing