UI Design, Trends, Patterns and User Experience - Academy of Design
-
Upload
shiran-sanjeewa -
Category
Education
-
view
1.601 -
download
1
description
Transcript of UI Design, Trends, Patterns and User Experience - Academy of Design
UI Design, Trends, Patterns and User
Experience
By Shiran Sanjeewa
twitter : @shiran_sanjeewa
Who I am?
Logo Designer / UX Consultant
Art Director at Netstarter
Founder of UX Colombo
*Dad
Buzz Words
Web Design, UI, HTML, PHP, jQuery, New Trends,
SOCIAL MEDIA, Responsive, UX, Information
Architecture
JOB TITLES
Web Designer, UI Engineer, HTML & PHP Developer,
jQuery Guru,
SOCIAL MEDIA EXPERT, UX Designer, Information
Architect
WHAT IS UI
The user interface is the space where interaction between
humans and machines occurs.
TRENDS
RESPONSIVE
“Break Points”
FLAT DESIGN
LONG SHADOWS
TOOLS OF THE TRADE
SKETCHBOOKS.
WIREFRAMING TOOLS.
ADOBE CREATIVE SUITE.
HTML AND PHP or ASP.net (other)
A NEW DIMENSION
Why a design has to be meaningful ?
DESIGN AND STYLE
WHY IS IT CALLED“USER” INTERFACE.
not “the designers interface”
Don’t Compromise
We need to think about who and what we’re designing for and ask ourselves why we’re applying a certain kind of aesthetic style to
our design.
What sets Traditional Design and UI Design APART
Prioritize
Prioritize your design tasks and make a workflow
Design Patterns
GETTING INPUT
Forms
Wizards
Feedback
NAVIGATION
Tabs
Menus
Pagination
Tag Cloud
HANDLING DATA
Search
Tables
Images (Galleries, Slideshows)
SOCIAL MEDIA
Live Feeds, Activity Streams (Twitter, Facebook)
Location Based Suggestions (4Square)
Answers (Quora, Disqus)
DESIGN PRACTICALLY
TECHNOLOGICAL BARRIERS
DEVELOPER MINDSET
STYLE GUIDES
STYLE GUIDES
STYLE GUIDES FOR THE WEB
www.bbc.co.uk/gel
GET YOUR DESIGN BRIEF
RIGHT
1. Objectives and Goals of the new design
2. Budget and Schedule
3. Target Audience
4. Scope of the Project
5. Available Materials/Needed Materials
6. Overall Style/Look
7. Any Definite “Do Not's”
1. Objectives and Goals of the new
design
The first thing you need to find out is what your client wants
from their new design. Is this a redesign or reworking of an
existing site, or is it a completely new design? Do they
already have solid ideas for what they want their site to do
or are their ideas more vague?
2. Budget and Schedule
Be realistic with your clients about both their budget
and schedule needs. If you know you can’t do
something within a certain budget or schedule, tell
them up front.
3. Target Audience
If your clients aren’t sure who they want to reach
with their site, ask them who their ideal customer is.
I’m sure they have an idea of who buys their
products or uses their services.
4. Project Scope
Sometimes, project scope is obvious from the goals
of a project.
5. Available Materials
Looking at their existing promotional materials can
shed valuable insight into what their design taste is
and what their priorities are.
6. Overall Style
Getting a sense of what your client wants in terms of
style is vital. But they’re not always good at
expressing what their tastes are.
CREATINGEXPERIENCES
‘Experience’ is an episode, a chunk of
time that one goes through sights and
sounds, feelings and thoughts, motives
and actions closely knitted together,
stored in memory, labelled, relived and
communicated to others.
In short, experience-led design is more
likely to evoke an emotion of engagement
and consequently, a strong desire to
associate with your product, system or
service.
A CASE STUDY
Facebook Home
Improvise what’s already
there
HAVE YOU EVER CONSIDERED THAT YOU'RE POOPING
WRONG?
www.youtube.com/watch?v=pYcv6odWfTM
MEET SQUATTY POTTY
Final Thoughts
• Design Websites with user in mind
• Innovate new ways to deliver information, not to showcase just a masterpiece.
• Its not about how beautiful it is but how useful it is.
www.uxcolombo.org
THANK YOU !!!