Bringing Tactility Back to UI/UX

April 18, 2013

So, what do you want to talk about?!

About Me

Gabriel G. FabiaBS CS-ST ID109Graduated last October, 2012Specialized in NLP

and I am aiming for:I am an:

About Me

Gabriel G. FabiaAKA “The Gabfather” B-)

About Me

I am a Very Good C#/C++/LUA ProgrammerI also delve into the Graphic Arts I am in no way a UI/UX “Expert”Not even a self-proclaimed expert

Experience

Help put up AHS Web Development TeamImagine Cup 2012 Australia (Rescue Run)

Startups and Freelance

Startups and Freelance

Ok, this one didn’t work out so well :))

Startups and Freelance

Startups and Freelance

Startups and Freelance

Brief Intro

• Why focus on UI/UX?• Why not just invest in more programmers?• Can anyone do UI/UX?– Yes, and No– And please, do not mix up the two!

What this Talk will NOT be about

• Human Interface Guidelines (H.I.G.)– You already have the documents for that– Read: “Guidelines”

Relating UI with UX

• Example of UX: Throwing and catching a ball• Example of UI: The stitching and sole-design

of the ball

UX’s Importance

• Good user experience captivates users to your app

• The more “feeling” they get, the more attracted at the cerebral level they get– Prone to remembering, lusting for, returning, and

even sharing your app

• The less “feeling” they get, the more indifferent they feel towards your app

UX: “Designing for Emotion”

• Who? What? Why? When? Where? How?– The asking SHOULD NEVER stop

• “What are you thinking?”• “Why did that confuse you?”• “What would you click next?”• Also, ask about business goals & needs

Aaaa brain overload! ..well not really.Although everything is important and we have no choice but to suck it up.

UX: “Designing for Emotion”

• UX takes into account the user’s needs at EVERY STAGE of the design lifecycle– Every step should always be User Centered

• For me, UX’s ultimate goal is:

TO MAKE THE USER FEEL GOOD...and not get lost in your app.

Why UX Matters

• You are probably already doing this• UI is difficult to learn (and to teach!)...

Unless you understand good UX

• Trivia: Want an example of bad UX? Refer to this presentation...

UI’s Importance

• Mental picture– Before the first Automobiles were designed,

people never bothered with the idea

UI’s Importance

• Or, the internet as a communications medium before chat and email services were polished

UI: “The Line and its Curve”

• Now more than ever, we do things on the web or on our phones

• “Not only because it is better for natural resources, but because it is more fun.

• “And ask yourself, why is it more fun?• “Because it’s Beautiful.”

• UI is all about pretty things… that work.

UI and UX: “Within a Team”

• They complement each other, but that’s it• Unless you are extremely talented, you

should only stick and master either one• The UX guy already has a lot on his mind– So yes, UX is more important in a way (IMO)

• UX should be there from Day 1, to deployment

Intermission

iOS/Android/WP/WWW H.I.G.

Q: Why are HIGs somewhat (or in some cases, critically) useful?

Mobile UI/UX: a bit more complex

• Screensize Constraints– iOS has 2 (+retina resolution)– Android has... So, so many...

• Orientation– Portrait/Landscape

• Hibernation Modes

and of course,• Touch > Bringing back Tactility

Putting UI/UX to work

• The F! • Should also work

for mobile

Putting UI/UX to work

• Swiping euphoria (Down and Right)

Putting UI/UX to work

• Landscape for virtual arcade• The further apart the hands are, the better it feels

– And of course, more of the app is visible this way

Putting UI/UX to work

• Keep important things within easy reach (usually by the right thumb)

Putting UI/UX to work

• Q: What if the user is Left handed?

Putting UI/UX to work

• Button Tactility(Twitter Bootstrap Example white)

UI/UX for a particular Target Audience

• One interesting example would be Children’s Apps (my particular favourite!)

UI/UX for Kids: Things to know

• Dragging is EXTREMELY DIFFICULT• Lower half of screen is the Danger Zone• TACTILITY or BUST• Narration is a Plus

UI/UX for Kids: Things to know

• Guidance from START to FINISH• Accidental Multi touch• Never, ever tell the child he lost in anything

Modern UI/UX Trends

• There is a transition going on:Bringing the real world into the digital world (or environment)

THE END

• OPEN FORUM!• Then, GameSalad time if we have time