ux design - a definitive introduction

Post on 19-Jul-2015

290 Views

Category:

Presentations & Public Speaking

0 Downloads

Preview:

Click to see full reader

TRANSCRIPT

TA

S

A R

I

MRIZA SELÇUK SAYDAM

@rssems #UXCamp14

günün menüsü…

Giriş Araştırma ve Veri

Tasarım SüreçleriArayüz

Tasarım Prensipleri

Optimizasyon

Sorular ve Cevaplar

RIZA SELÇUK SAYDAMUX Designer of izlesene.com at Nokta

@rssems #UXCamp14

@rssems #UXCamp14

@rssems #UXCamp14

Great UI isn’t there

Great UI isn’t there

@rssems #UXCamp14

VERİARAŞTIRMA ve "Nereye gitmek istedigini bilmiyorsan hangi

yoldan gideceğin farketmez." Cheshire

@rssems #UXCamp14

Data, Not Design, is King in Age of GoogleAge of Data

"We let the math and the data govern how things look and feel."

@rssems #UXCamp14

“If you torture the data long enough, it will confess”

!

Ronald Coase (Nobel Prize in Economics)

@rssems #UXCamp14

Mind MapZihin Haritası

www.mindnode.com

69%

84%

39%

@rssems #UXCamp14

Kullanıcı Araştırması

@rssems #UXCamp14

Hedef Kitle, Persona

uxpin.com

@rssems #UXCamp14

Hedef Kitle, Persona

uxpin.com

@rssems #UXCamp14

Business Model CanvasKanvas İş Modeli

uxpin.com

@rssems #UXCamp14

"Customer Journey Map"Kullanıcı Deneyim Haritası

thisisservicedesignthinking.com

@rssems #UXCamp14

"Customer Journey Map"Kullanıcı Deneyim Haritası

thisisservicedesignthinking.com

Customer Journey Map

@rssems #UXCamp14

and Content StrategyInformation Architechturtre

@rssems #UXCamp14

Competitive AnalysisBenchmark

Google Analytics

TASARIM

@rssems #UXCamp14

Increasing the number of choices will increase Hick-Hyman Law

Source: http://1.usa.gov/1whJPxj

@rssems #UXCamp14

Hick’s Law

@rssems #UXCamp14

Hick’s Law

@rssems #UXCamp14 Source: http://en.wikipedia.org/wiki/Fitts

The closer and bigger something is to you, the easier & faster it is for you to touch it (accurately).

Fitts’s Law

@rssems #UXCamp14

Fitts’s Law

@rssems #UXCamp14

Dokunmatik

@rssems #UXCamp14

Dokunmatik

@rssems #UXCamp14

Dokunmatik

@rssems #UXCamp14

Dokunmatik

@rssems #UXCamp14

The number of objects an average person can hold in working memory is about 7±2.

Miller’s Law

@rssems #UXCamp14

The number of objects an average person can hold in working memory is about 7±2.

Miller’s Law

@rssems #UXCamp14

Kalem, Grid Defter, Hayal GücüEskiz

@rssems #UXCamp14

Kalem, Grid Defter, Hayal GücüEskiz

@rssems #UXCamp14

Kalem, Grid Defter, Hayal GücüEskiz

@rssems #UXCamp14

Eskiz Örneği

@rssems #UXCamp14

Fonksiyonel, ayrıntılı taslakWireframe

moqups.com & balsamiq.com

@rssems #UXCamp14

Wireframeblueprint for design

@rssems #UXCamp14

Fonksiyonel, ayrıntılı taslakWireframe

moqups.com & balsamiq.com

@rssems #UXCamp14

Wireframe Örneği

@rssems #UXCamp14

@rssems #UXCamp14

Wireframe ve Renkler

@rssems #UXCamp14

Amatör de olsa…

@rssems #UXCamp14

Kompleks de olsa…

@rssems #UXCamp14

Bir örnek daha…

@rssems #UXCamp14

ve Lorem IpsumKelimeler

@rssems #UXCamp14

ve Lorem IpsumKelimeler

@rssems #UXCamp14

Evet, bazı şeyler wireframe’lenemez!Peki ya?

http://insideintercom.io/things-cant-wireframed/

@rssems #UXCamp14

Ama…

@rssems #UXCamp14

Wireframe’in gerçek içerik ile birleşimiMockup

@rssems #UXCamp14

invision, flinto, marvel, popPrototip

@rssems #UXCamp14

Prototip Araçları

Proto.io - Marvel

InVisio Flinto

@rssems #UXCamp14

Arayüz Tasarımı

@rssems #UXCamp14

MOLASIKAHVE

@rssems #UXCamp14

Arayüz Tasarımı

@rssems #UXCamp14

Arayüz Tasarımı

@rssems #UXCamp14

+ Skala PreviewPhotoshop

@rssems #UXCamp14

+ MirrorSketch App

@rssems #UXCamp14

Sık görülen problemlere ortak çözümlerDesign Pattern

@rssems #UXCamp14

Sık görülen problemlere ortak çözümlerDesign Pattern

@rssems #UXCamp14

Sık görülen problemlere ortak çözümlerDesign Pattern

@rssems #UXCamp14

Android, iOS, Windows Phone…Platform Farkı

Typography

@rssems #UXCamp14

Color TheoryRenk

@rssems #UXCamp14

Color TheoryRenk

Renkhttp://www.rocket-design.fr/color-template/

IconsPixel perfect assets and Icons

Animation

@rssems #UXCamp14

Hızlı ol veya hızlı olduğunu ‘hissettir’Hız

The Animation Tools

Xcode > Origami > Framer.JS > After Effects > Flinto = Marvel (…)

@rssems #UXCamp14

Hata Ekranları, Boş Alanlar…Tam Deneyim

@rssems #UXCamp14

Hata Ekranları, Boş Alanlar…Tam Deneyim

@rssems #UXCamp14

Hata Ekranları, Boş Alanlar…Tam Deneyim

@rssems #UXCamp14

Hata Ekranları, Boş Alanlar…Tam Deneyim

@rssems #UXCamp14

Hata Ekranları, Boş Alanlar…Tam Deneyim

@rssems #UXCamp14

Hata Ekranları, Boş Alanlar…Tam Deneyim

@rssems #UXCamp14

@rssems #UXCamp14

"A mathematical model of the finding of usability problems"

Test with 5 Users

via http://bit.ly/test5users

@rssems #UXCamp14

@rssems #UXCamp14

UX bilimdir. Sanat değil.

@rssems #UXCamp14

CEVAPLARSORULAR

RIZA SELÇUK SAYDAMUX Designer of izlesene.com at Nokta

@rssems #UXCamp14

top related