57
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Designing technical documentation for tablets Ellis Pratt | Director | Twitter @ellispratt | www.cherrylear.com | [email protected] Maxwell Hoffmann | Adobe Product Evangelist | Twitter @maxwellhoffmann | [email protected]

Designing technical documentation for tablets

Embed Size (px)

DESCRIPTION

With more and more people using tablets for reading technical documentation, this webinar looks at how this trend will affect the way technical documents are designed and developed. We'll look at examples of documents that 'work' on a tablet, as well as documents that don't. We'll explore some of the emerging design trends for presenting technical documentation on tablets, and what they mean for Technical Writers. We'll also investigate how tablets, and the technologies contained within then, could be used to improve the User Assistance we provide to our readers. Ellis is Director and Help Strategist at Cherryleaf, a technical writing services and training company based near London, in the United Kingdom. He has over fifteen years’ experience working in the field of documentation, has a BA in Business Studies, and is an Associate of the Institution of Engineering and Technology. Ranked the most influential blogger on technical communication in Europe, Ellis is also an author and editor of two books: ‘How to Write Instructions’ and ‘Trends in Technical Communication’.

Citation preview

Page 1: Designing technical documentation for tablets

© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Designing technical documentation for tablets

Ellis Pratt | Director | Twitter @ellispratt | www.cherrylear.com | [email protected]

Maxwell Hoffmann | Adobe Product Evangelist | Twitter @maxwellhoffmann | [email protected]

Page 2: Designing technical documentation for tablets

© 2012 Adobe Systems Incorporated. All Rights Reserved.

About Adobe

2

74 Offices in 43 Countries

Corporate Headquarters in San Jose, California

Founded in December 1982

$4.2 billion in revenue in FY2011

More than 10,000 employees

Adobe donates a minimum of 1% of net income to philanthropy

We simplify complicated, inefficient, and expensive workflows. We enable more engaging, compelling content. We drive greater return from digital media and marketing investments.

Page 3: Designing technical documentation for tablets

© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

About Maxwell Hoffmann

3

Maxwell Hoffmann Product Evangelist, Tech Comm Suite

Former Product Manager and Sales Training Director for Frame Technology

15 years in translation industry, working on “whatever documents walked through the door”

Trained over 1,200 people in hands-on, scalable publishing solutions

Page 4: Designing technical documentation for tablets

© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

About our Guest Thought Leader

4

Ellis Pratt Director and co-owner of Cherryleaf

Based close to London’s Heathrow Airport

Working in Technical Communications since circa 1996(!)

Page 5: Designing technical documentation for tablets

Designing technical documentation

for tablets

Adobe Webinar Ellis Pratt Cherryleaf

Page 6: Designing technical documentation for tablets

What we’ll cover

1. About me

2. What makes tablet devices different?

3, 4 & 5. Three uses of tablets, from a techcomms view

6. A SIMPLES strategy

Page 7: Designing technical documentation for tablets

1. About me

Page 8: Designing technical documentation for tablets

Director of Cherryleaf

UK technical writing services company My experience is of technical communication in:

• UK and Europe • IT & medical equipment

Workshops on writing for Web-based apps, iPads & DITA

QuickTime™ and a decompressor

are needed to see this picture.

Page 9: Designing technical documentation for tablets

2. What makes tablet devices different?

Page 10: Designing technical documentation for tablets

What we’ll cover

The competitors

Why are tablets popular?

We need to abandon some assumptions

Page 11: Designing technical documentation for tablets

The competitors

Page 12: Designing technical documentation for tablets

Why a tablet? Intuitive to use (almost)

Long battery life

Portability

Bring Your Own Device

Retina screen

Weight

Always on

Page 13: Designing technical documentation for tablets

We need to abandon some assumptions

Page 14: Designing technical documentation for tablets

The screen

“Retina” displays

Greater contrast on screens

Closer to paper than a screen

Tablet screen sizes can differ

Page 15: Designing technical documentation for tablets

Abandoning Assumptions

“The TOC must be on the left”

“Scrolling vertically is better”

Michael Campbell

Page 16: Designing technical documentation for tablets

Abandoning Assumptions

“ As designers, we tend to think that people start at the top left and just move left to right and down the page.

But research shows that isn’t what happens.

People are attracted primarily to contrast, which is one of the key visual principles that has been studied by researchers again and again.

Contrast is created by differences in light and dark, thick and thin, big and small.

For example, headings that are bolder than the text, pictures that are big in relation to small pictures. ”

Karen Schriver

Page 17: Designing technical documentation for tablets

Can we use print composition theories?

Kress and Van Leeuven

Page 18: Designing technical documentation for tablets

We can do things differently

Some print composition techniques now work on screen

We can use a horizontal, paper metaphor

Right-sided navigation is now possible

Page 19: Designing technical documentation for tablets

We can do things differently

“Deep learning” on screen is now possible

Page 20: Designing technical documentation for tablets

It’s haptic

Device can vibrate

Device can be aware of user’s location

You can pinch and zoom to view some content

Page 21: Designing technical documentation for tablets

Three uses of tablets, from a techcomms view

Mobile apps

Mobile web

Mobile documents

Page 22: Designing technical documentation for tablets

3.Mobile apps

Page 23: Designing technical documentation for tablets

Smaller, more focused apps

Often familiar to user

Touch terminology

“First user” Help

Page 24: Designing technical documentation for tablets

App abandonment

Many used only 3-4 times

Help moves to the product description

First user interaction Help

Page 25: Designing technical documentation for tablets

Limited traditional online Help

Leave the app to read Help

Limited help “tools”

Advice from Apple

No settled standards

Page 26: Designing technical documentation for tablets

We need Help, but not as we know it

Flow-based User Assistance

Page 27: Designing technical documentation for tablets

Flow-based User Assistance

Don’t break the user’s flow

Guide and pre-empt

= Help is embedded in the product

Page 28: Designing technical documentation for tablets

Flow-based User Assistance

Assistance is provided in context

It’s aware of the user’s situation

Can advise on a good choice

Page 29: Designing technical documentation for tablets

Apple’s Help patent

April 2012

Page 30: Designing technical documentation for tablets

Apple’s Help “templates”

Carousel view

Shake to change

3D Zoetrope

Page 31: Designing technical documentation for tablets

Gallery of Help examples

www.g2meyer.com/gallery/main.php?g2_itemId=5893

Page 32: Designing technical documentation for tablets

4. Mobile Web

Page 33: Designing technical documentation for tablets

Web-based apps

Usually requires a connection to the internet

Can look like an app on the desktop

Or accessed via the browser

Page 34: Designing technical documentation for tablets

Web-based apps You’ll still have:

• Retina screen

• Portrait and landscape mode

• Touch and haptic interactions

when HTML5 is adopted

Page 35: Designing technical documentation for tablets

Web-based apps

You don’t need to learn Objective C

Page 36: Designing technical documentation for tablets

So is there Help in Web-based apps?

There is lots of Help, (under different names)

It is embedded in the applications

H/T Briana Wherry, Alfresco

Page 37: Designing technical documentation for tablets

Social Help

There is a social element

• Co coaching

• Social proof

H/T Brian Wherry & Robert Cialdini

Page 38: Designing technical documentation for tablets

5. Mobile documents

Page 39: Designing technical documentation for tablets

Types of mobile documents

Electronic Flight Bag

Student text books

Magazines

Operations manuals

Page 40: Designing technical documentation for tablets

Two competing models

Format and content are inseparable Publishing

Format and content are separate issues

Technical Publications

Page 41: Designing technical documentation for tablets

2 competing models

“We’re about to usher in a golden age of PDFs on the

iPad.”

Paul Ford @fttrain

via Karen McGrane

Page 42: Designing technical documentation for tablets

PDFs work well

Read in Adobe Reader iBooks, etc

Can pinch and zoom

Large file size?

Page 43: Designing technical documentation for tablets

EPUB

Formatting can be an issue

Tables

Images

Videos must be .mp4 (mv4) format

Page 44: Designing technical documentation for tablets

EPUB in the future?

Embedded fonts

CSS3

Nested tables

Boxed elements

SVG graphics

Text popups

Fixed layouts

Page 45: Designing technical documentation for tablets

HTML5

You can save pages offline

in theory

Page 46: Designing technical documentation for tablets

What about mediums for structured content?

HTML5 may be your best bet

Page 47: Designing technical documentation for tablets

6. A SIMPLES strategy

Page 48: Designing technical documentation for tablets

A SIMPLES strategy Scaleable (to different sizes)

Intuitive to the user

Mobile-friendly

Platform-agnostic

Legalese (right for the platform)

Engaging (to the user)

Single sourced (re-usable, extensible content) H/T Keren Okman, SAP

Page 49: Designing technical documentation for tablets

Summary

Page 50: Designing technical documentation for tablets

Plus ça change (plus c'est la même chose)? User Assistance will still be there, but in different places

We’ll need to deliver content on different devices, in different formats

We’ll be using some new (old) design metaphors

Help Authoring tools and HTML5 will solve a lot of the problems we see today

Page 51: Designing technical documentation for tablets

Blatant plugs

Q4 Workshops on writing for Web-based apps, iPads & DITA Free monthly newsletter Cherryleaf.com/blog

Page 52: Designing technical documentation for tablets

For more information

[email protected]

Page 53: Designing technical documentation for tablets

Questions?

Page 54: Designing technical documentation for tablets

End

(c) Cherryleaf 2012

Page 55: Designing technical documentation for tablets

© 2012 Adobe Systems Incorporated. All Rights Reserved.

Upcoming Adobe TechComm Webinars

Content Scenarios for Exploring New Information Products, Joe Gollner, 27 June

Find Out How to Write XSLT Statements for XML to XML Transformations in a 5-part eSeminars Series, 28 June to 19 July, Tom Aldous

Expand Your Content Reuse Potential through Indirect Addressing: Using @keys-based Referencing in DITA 1.2 – Nancy Harrison, 11 July

Are You Tempted to Use a Template to Expedite Policies & Procedure Development? Raymond Urgo – 12 July

Are you struggling to create long, complex documents with Microsoft Word? There is a much easier way! – Tom Aldous, 13 July

Part II: Creating an Accessible Layout – Tips to make documents more accessible (structure, colors, fonts, more) – Char James-Tanney, 17 July,

Part III: Developing Accessible Content – Tips on grammar, paragraph, and sentence length, alternate text, and more – Char James-Tanney, 31 July

55

Calendar of upcoming eSeminars: http://adobe.ly/xdzOYa

Page 56: Designing technical documentation for tablets

© 2012 Adobe Systems Incorporated. All Rights Reserved.

Questions and Answers

56

Page 57: Designing technical documentation for tablets

© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Contact Information

57

Information Ellis Pratt Cherryleaf

Blog Cherryleaf.com/blog Twitter http://twitter.com/ellispratt Email [email protected] Web http://cherryleaf.com

Maxwell Hoffmann Adobe Systems, Inc. Product Evangelist

Blog blogs.adobe.com/techcomm Blog blogs.adobe.com/mbhoffmann Twitter twitter.com/maxwellhoffmann

Email [email protected] Web www.adobe.com LinkedIn www.linkedin.com/in/maxwellhoffmann Facebook maxwell.hoffmann1 Facebook As Adobe Technical Communication Professionals Group

Previously recorded eSeminars: http://adobe.ly/qo3pzc

Calendar of upcoming eSeminars: http://adobe.ly/xdzOYa