Think mobile first - English version

50 %
50 %
Information about Think mobile first - English version
Marketing

Published on March 17, 2014

Author: dennissew

Source: slideshare.net

Description

Think Mobile First for Online SurveyDesign
Think Respondent First

THINK MOBILE FIRST! THINK RESPONDENT FIRST! Jon Puleston | Dennis Sewberath

thinkmobile1st.com Pleasant experience for each respondent Regardless of which device is used

thinkmobile1st.com You need to find a way to make your respondents… STOP & ACTUALLY THINK!

thinkmobile1st.com Mobile surveys: Piece of cake? Hype?

thinkmobile1st.com Mobile is … Not a (new) strategy Mobile is … A (new) reality

thinkmobile1st.com Ignore? Do you miss sample groups if you exclude mobile? Are all online surveys suitable for mobile?

thinkmobile1st.com Because your questionnaire … • Too many questions and answer options? • Too much text or too many pictures? • Is too long? • A specific method? What excuse do you have to exclude mobile devices?

thinkmobile1st.com Let me put it this way … If you could do it on mobile, would you want to?

thinkmobile1st.com Dennis Sewberath

thinkmobile1st.com THINKMOBILE1ST.com

thinkmobile1st.com Today Advantages of … THINK MOBILE FIRST 1) Design 2) Content

thinkmobile1st.com Mobile First – Think Mobile First Approach – this thinking fits perfectly how we should look at online surveydesign

thinkmobile1st.com From Think Desktop First …

thinkmobile1st.com … to Think Mobile First

thinkmobile1st.com Anyone, anywhere and anytime mobile It not only brings new opportunities It also requires changes to design of questionnaires

thinkmobile1st.com Situation and mood determine device

thinkmobile1st.com There is a change in use

thinkmobile1st.com Our mobile behavior decides content and design Distraction – One Eye Focus Design Content takes over from navigation Clear design is must

thinkmobile1st.com What do you define YOURSELF as mobile?

thinkmobile1st.com Smartphones? Feature phones? Tablets? Laptops? If you are on the go? F2F with tablets? Or only if you use specific options (camera, geo, etc.)

thinkmobile1st.com THE MOBILE JUNGLE HTML5, APPS, WAP, MOBILE RESEARCH, WEB, ETC

thinkmobile1st.com Your are not only online with a PC. A website or online survey neither. Mobile Web

thinkmobile1st.com NATIVE APP WEB APPVS Native or web app

thinkmobile1st.com Three types of apps NATIVE APPS Installed on your phone, use functions of your device Examples: WhatsApp, Skype, Angry Birds WEB APPS Mobile friendly version of a webiste / survey through the browser Example: m.youtube.com, m.facebook.com HYBRID APPS Combination of native and web In fact, a native app, but the content is loaded from web Example: BBC, NU.nl

thinkmobile1st.com Choice of which App Checklist Invitations Push, SMS, QR Code, Mail, GEO Fencing Options Specific functions – camera, offline, passive data Extra Fast response in a short time, should work on all devices

thinkmobile1st.com ONE PROBLEM WITH NATIVE APPS! Find people that want to install and use the app

thinkmobile1st.com Html5 or Flash?

thinkmobile1st.com Too much variation in devices, which do you choose?

thinkmobile1st.com What to do with feature phones? Feature phone internet Smart phone Emerging markets, 2G, User type +/- 10 questions

thinkmobile1st.com + NO TOUCH!

thinkmobile1st.com Which device and design is the decision of you as researcher device detection device agnostic device friendly

thinkmobile1st.com Interact with content, not with traditional menus and buttons NUI instead of GUI Touch vs. Mouse navigation

thinkmobile1st.com Respondent = REAL person

thinkmobile1st.com SPECIFIC OPTIONS IN MOBILE SURVEYS Camera, GEO, Offline, Passive data

thinkmobile1st.com Photo, video, barcode, QR scan Camera and audio

thinkmobile1st.com ROADBLOCKS? Privacy, Regulations for taking photos, Audio recording on location, Bring the story to life, Cost for data traffic, Internet connection

thinkmobile1st.com GEO 1) Capture GEO coordinates 2) GEO Fencing, a survey can be activated around a geographic location

thinkmobile1st.com ROADBLOCKS? The difference between GPS and WiFi tracking: GPS itself can’t follow anyone, Just as a radio broadcast can’t follow someone with a radio GPS does not work indoor, WiFi does GPS is much more accurate on the position then WiFi People need to indicate that they are willing to receive location based surveys

thinkmobile1st.com TYPICAL MOBILE PROJECTS

thinkmobile1st.com SPECIFIC INFORMATION, RICHER DATA Camera, GEO CERTAIN TARGETGROUPS Young adults, emerging markets ENGAGEMENT, CERTAIN MOMENTS “Heat of the moment”, diary studies, tv show, events, polls ALTERNATIVE SOLUTION F2F

thinkmobile1st.com But remember, you're already run mobile ... Your current online survey can be completed on mobile devices!

thinkmobile1st.com Our goal: device friendly!

thinkmobile1st.com And all the knowledge and experience we have of “online PC” is an advantage for Mobile Today

thinkmobile1st.com Speeding Untruthfulness Gender variance Balance of sample Translation issues Panel quality issues Cultural differences The impact of question styles Survey design effects Intra country differences Intra panel differences PLEASE NOTE!

thinkmobile1st.com Not only just scripting also designing

thinkmobile1st.com Focusing only on what to say Not just focusing on what to say but on how to say it 150 years Evolution in advertising

thinkmobile1st.com A similar evolution in presentation design

thinkmobile1st.com Then someone discoved clipart!

thinkmobile1st.com Focusing only on what I want to say Focusing on how to communicate a message

thinkmobile1st.com And the evolution of SURVEY DESIGN....

thinkmobile1st.com We started out with surveys that looked like this …

thinkmobile1st.com … and today we have reached the stage where they look like this!

thinkmobile1st.com Where is the art of surveydesign? Surveydesign is a creative art form akin to webdesign. We have not got our heads round surveydesign quite yet.

thinkmobile1st.com We are at that 1980’s powerpoint CLIPART & TRANSITION stage

thinkmobile1st.com And the issues go way beyond the visual ...

thinkmobile1st.com The survey design process needs to be different Focusing on what we want to know ? ? Focusing on how to encourage people to respond

thinkmobile1st.com Putting more thought into what we REALLY want to know

thinkmobile1st.com Imagine: An alien lands on planet earth and you could ask him ONE question

thinkmobile1st.com “ON A SCALE OF 1 TO 10” How much do you like planet earth?

thinkmobile1st.com You need to find a way to make your respondents… STOP & ACTUALLY THINK!

thinkmobile1st.com What can help us to motivate people? Maak het visually Use interactive question types Questification Reward the truth Using game elements, small rules Gamification

thinkmobile1st.com Illustrate answers – images are more easily processed Make is visual

thinkmobile1st.com By the use of emotion we found you could encourage people to think more

thinkmobile1st.com USING IMAGES to simulate the imagination and triggering emotional responses

thinkmobile1st.com USING IMAGES also helps communicating ideas more effectively A picture says more than 1000 words

thinkmobile1st.com Example – ‘ergonomic’ question type Using interactive question types

thinkmobile1st.com Example ergonomic in colours and illustration

thinkmobile1st.com The role of iconography Less load on the working memory

thinkmobile1st.com QUESTIFICATION Not only visual adjustments but also the impact how you word questions have a big impact QUESTION OPYWRITING

thinkmobile1st.com How to make questions more engaging?

thinkmobile1st.com Inject some humanity into questions …

thinkmobile1st.com Which of these paint colours do you like best? If you had to paint your living room which one would you pick? Make it personal...

thinkmobile1st.com What would you wear? What would you wear on a first date? Use emotion ...

thinkmobile1st.com What do you think about this new product? Imagine you are the boss of a company. Your job is now to evaluate this new product … Projection, let them identify with someone else ...

thinkmobile1st.com Can you make a lit of your favourite shops? Imagine you could set up your own perfect shopping centre just with shops you want. Can you make a list of the shops you would have in your shopping centre? Stimulate fantasy

thinkmobile1st.com Example – combination of projection, interactive question type, use of icons

thinkmobile1st.com Understanding the role of point & reward systems in surveys Rewarding the truth

thinkmobile1st.com Surveys actually reward “speeding” ACTION SURVEY SAME POINTS REWARD + SAVED TIME SPEED THROUGH IT TRIGGER REWARD

thinkmobile1st.com Solution = Insert game mechanics into surveys that reward effort and truth TRIGGER = GAME REWARD BEING THOUGHTFUL & TRUTHFUL

thinkmobile1st.com Bonus Rewarding thinking Example: Spontaneous brand awereness

thinkmobile1st.com Example: Prompted brand awereness

thinkmobile1st.com Rules can turn questions into mental puzzles

thinkmobile1st.com Pick EXACTLY 3 ... In LESS THAN 7 words Name ONE THING you would change about this product If you were buying product …. Which of these things would you DEFINITELY do prior to purchase? In your PERFECT world what would you do … Using abstract rules and conditions in questions

thinkmobile1st.com The visual appeal, interactive question types, the way of asking questions has led to gamification

thinkmobile1st.com Leading to more entertainment based ways of designing surveys

thinkmobile1st.com Case Study: Re-inventing a retail evaluation survey

thinkmobile1st.com Based around the concept of challenging respondents to design their perfect supermarket

thinkmobile1st.com

thinkmobile1st.com We placed their current supermarkets on trial Please give your judgment on how ALDI performs on these range of factors

thinkmobile1st.com But there is a limit to how far you can take this thinking …

thinkmobile1st.com “The ugly sister issue” Not only decorative changing! Otherwise you miss the real purpose

thinkmobile1st.com Example - DETROIT/FORD

thinkmobile1st.com Example - EMI

thinkmobile1st.com Example – Eating on the go

thinkmobile1st.com Now a new challenge - mobile … All this knowledge we learnt with online is not wasted it is just PERFECT FOR MOBILE ...

thinkmobile1st.com How do you start? 1) New specific options in mobile 2) Challenges in design

thinkmobile1st.com Visual appeal, interactive question types, gamification NICE TO HAVE for desktop MUST HAVE for Mobile and Touch THINK MOBILE FIRST in design and content! If it works for mobile if also works for desktop

thinkmobile1st.com Limited space Bonsai Surveys

thinkmobile1st.com Limited space for content Questions and answers short and easy to read Change the way you ask questions Minimize non-essential content (remove logo's etc.), keep it simple Minimize distractions, people are quickly distracted so you must immediately get their attention when they see the question on the screen = one eye focus

thinkmobile1st.com Limited space in design Small screens however this limitation requires more creativity and you just need leave unnecessary things away Too many options are misleading With "Think Mobile First" you concentrate only on the things that are important

thinkmobile1st.com • Portrait or landscape? • One or multiple pages? • Adaptive, Responsive or “One size fits all” approach • … No right or wrong! Choice is yours! And this decission can be different per project

thinkmobile1st.com Question Option 1 Option 2 Option 3 Option 4 Question Option 1 Option 2 Option 3 Option 4 Portrait vs landscape? > Natural preference A lot of scrolling down needed to reach the next button GMI surveys GMI surveys

thinkmobile1st.com Portrait surveys look great on phones …

thinkmobile1st.com Grid Question Option 1 O O Option 2 O O Option 3 O O Option 4 O O Grid Question Option 1 O O O O O Option 2 O O O O O Option 3 O O O O O Option 4 O O O O O > But can’t deal with wider style questions. HORIZONTALE SCROLL… A BIG NO-NO! GMI surveys GMI surveys

thinkmobile1st.com How about using adaptive design? Design horizontal for pc’s & tablets and portrait for mobile Grid Question Option 1 O O O O O Option 2 O O O O O Option 3 O O O O O Option 4 O O O O O Option 1 Column 1 O Column 2 O Column 3 O Column 4 O > GMI surveysGMI surveys Option 2 Column 1 O Column 2 O Column 3 O Column 4 O > GMI surveys On a mobile break into 4 separate questions you ask one by one e.g. on a PC use a traditional grid

thinkmobile1st.com This approach however brings a lot of extra work …

thinkmobile1st.com It is almost impossible to use an automated approach without questions looking a mess. You end up with – 2x design? 2x testing? 2x data? GMI surveysGMI surveys OPTION 1 OPTION 2 OPTION 3 LOGO 1 LOGO 2 LOGO 3 OPTION 1 OPTION 2 OPTION 3 LOGO 1 LOGO 2 LOGO 3

thinkmobile1st.com You run into all sort of rendering issues. Rate this ad? Option 1 Column 1 O Column 2 O Column 3 O Column 4 O > GMI surveysGMI surveys Rate this ad? > GMI surveys

thinkmobile1st.com GMI surveysGMI surveys You can only work with a limited portfolio of question types.

thinkmobile1st.com Our solution = A fixed landscape approach Don’t forget to say this to respondents!

thinkmobile1st.com PC Surveys are naturally landscape

thinkmobile1st.com INTERACTIVE QUESTIONTYPES FOR PC ARE NICE TO HAVE FOR MULTI DEVICE DESIGN, FOR EFFICIENT USE WITH BOTH MOUSE AND TOUCH WE BELIEVE THAT THIS IS A MUST HAVE

thinkmobile1st.com Our solution = Invest in more interactive question types

thinkmobile1st.com Interactive question types, Example dynamic grid/matrix alternatives Strongly disagree disagree Neither Agree Strongly Agree I like brocolliI like broccoliI like cheeseI like broccoliI like chocolate Strongly Agree disagree

thinkmobile1st.com Screen optimisation for mobile

thinkmobile1st.com Understand the space limitations PC SCREEN 1024 X 768 pixels MOBILE SCREEN 800 X 480 pixels

thinkmobile1st.com And with tablets … TABLETS UP TO 2048 × 1536 pixels 800 x 480 pixels MOBILE SCREEN

thinkmobile1st.com OUR SOLUTION = MAKE EVERY PIXEL COUNT

thinkmobile1st.com But that is not the whole story, you also need to take account of pixel density iPhone has higher pixel density iPhone 5 = 1136 X 640 pixels SAMSUNG GALAXY S2 800 X 480 But is actually smaller

thinkmobile1st.com Space is a premium so make every pixel count … Which car logo do you like best?

thinkmobile1st.com Which car logo do you like best? Loose the gaps and spaces!

thinkmobile1st.com And there is also the issue of perspective ratio’s: Mobile < 1/3rd the size of a PC screen

thinkmobile1st.com How to deal with these issues?

thinkmobile1st.com OUR APPROACH Use auto width scaling So on whatever device you open the survey it opens always in the maximal width Think about scale ratio’s not pixels We work to a 1:1.7 design ratio Need to scale down not up Else you will end up with tiny surveys on PC’s and Tablets

thinkmobile1st.com On mobile you have limited space in height (in landscape mode)

thinkmobile1st.com Top of the survey is sacred VIEWING ZONE Push everything as close to the top of the screen

thinkmobile1st.com Adapt your templates Question Option 1 O O O O O Option 2 O O O O O Option 3 O O O O O Option 4 O O O O O GMI surveys Question Option 1 O O O O O Option 2 O O O O O Option 3 O O O O O Option 4 O O O O O Option 5 O O O O O > But the “next` button on the side Remove unnecessary items Use AUTO-NEXT where you can

thinkmobile1st.com Example PC screen Two columns: because when you have answers where you have to scroll will less likely to be selected Navigation BRANDING Built in the navigation Progress bar across the top

thinkmobile1st.com Sam example how it looks on mobile Shift away from OLD SCHOOL buttons, radio/checkboxes

thinkmobile1st.com The shift away from OLD SCHOOL buttons … If you have questions with lots of option choices And some of them are really long sentences like this Realise that the buttons themselves take up valuable space Question title

thinkmobile1st.com Space is a premium on a mobile so make every pixel count … By switching to box questions like this You can fit in a lot more content onto the page Because you are using up the whole width of the available question space So you have more space to fit in more words You can use box highlighting like this to indicate that you have selected Question title

thinkmobile1st.com By switching to box questions like this You can fit in a lot more content onto the page Because you are using up the whole width of the available question space So you have more space to fit in more words You can use box highlighting like this to indicate that you have selected Question title Space is a premium on a mobile so make every pixel count …

thinkmobile1st.com Minimum size, make a style sheet for each device PC survey = 11pt Mobile = 18pt 44 pixels Minimum button sizes Minimum font sizes Minimum line thickness 2 pixels

thinkmobile1st.com Think about where you put labels Labels need to be on the top as fingers get in the way

thinkmobile1st.com Place open ended questions at the top of the page to allow space for keyboard pop-up

thinkmobile1st.com Imagery is a luxury … It uses up design space and expensive bandwidth What brand of printer do you have? HP Deskjet 20xxxxx HP Deskjet 40xxx HP Deskjet 80xxxx

thinkmobile1st.com Use imagery and iconography intelligently: Wherever space permits, use it to bring a survey to life! Bring text into buttons as this makes it easier to click

thinkmobile1st.com Some advantages with interactive question types: Drag and drop is much more intuitive. choice Option BOption A choice choice

thinkmobile1st.com Sliding works as a dream

thinkmobile1st.com Exploit slider with aniumation effects

thinkmobile1st.com For questions with lots of instructions Break this out to a separate introduction page

thinkmobile1st.com Summarize the task at the question Instructions

thinkmobile1st.com If you do this – try and design the message if you can – nobody likes to read blocks of text

thinkmobile1st.com An approach? Employ a good tweeter to write all your instructions under 140 characters! Clear and short, it will be read

thinkmobile1st.com We have two thumbs, so double questions like this on one screen can work perfectly …

thinkmobile1st.com These options in design not only have an advantage for mobile specific but also for PC. So with think mobile first you have an advantage in both design and content even when you are not deciding to go mobile!

thinkmobile1st.com Technique Don’t get limited by the software you are using

thinkmobile1st.com Insight into … STOP & ACTUALLY THINK! advantages with … THINK MOBILE FIRST design and content

thinkmobile1st.com Questions?

Add a comment

Related presentations

Brands are more invested today than ever before on curating and distributing paid,...

Marketers need to be creating and publishing original content across many differen...

As content marketing continues to increase in popularity in every industry, more m...

Il Direct Email Marketing (DEM) è una tipologia di marketing diretto che usa la po...

This presentation contains all 120 rules from Part 1 of the 2nd edition of "Email ...

Olá, somos o Paulo Bernardes e o Pedro Silvestre, temos uma ambição em comum de me...

Related pages

ThinkFree

ThinkFree Online service provides a free web office suite with 1 GB of online storage. You can use a variety of devices to access and manage stored ...
Read more

First (english) | LinkedIn

Teach First English Teacher at Teach First Past Resourcing Intern at Nationwide Building Society, Vacation Placement at McCormicks Solicitors, ...
Read more

Read the Bible. A free Bible on your phone, tablet, and ...

With the YouVersion Bible App, you can read, watch, listen, and share on your smartphone or tablet, and online at Bible.com. ... MOBILE APPS; LANGUAGE;
Read more

News - MSN

Find latest news coverage of breaking news ... Washington’s ‘governing elite’ think Americans are ... The first trailer for The Grand Tour has ...
Read more

Easy scheduling | Doodle

Doodle radically simplifies the process of scheduling events, ... Doodle Mobile; Premium Doodle; Calendar Connect; ... English ...
Read more

BibleGateway.com: A searchable online Bible in over 150 ...

Today's passage is from the New International Version. Read by Max McLean. Provided by The ... Mobile Bible Gateway; ChurchSource; ... With Bible Gateway ...
Read more

www.avolites.de - Web API Demo

English version below. ... die Web-API steht auf allen Pulten vom Titan Mobile an aufwärts ... First public files were the Avolites web API documentation ...
Read more

Google Translate

English. Spanish. French. Detect language English ... About Google Translate Community Mobile. About Google Privacy & Terms Help Send feedback ...
Read more

Android

Android Carousel Explore ... Explore Android, the world’s most popular mobile operating ... The latest version of Android is here with sweet features ...
Read more