What I learn from .018 : Coursera course : Usable Security

Ages ago. I enrolled myself into course Usable Security on Coursera. 

    It was about usability and Human-Computer Interaction related to security. If you are interested in UX.  I highly recommended this course.
Sadly, I lost some of my notes, but this is what I still remember from  I learned from this course:

1. Human-Computer Interaction (HCI) is a study how people interact with technology.
2. Tasks are goals that users set out to accomplish when they are using the system. 
3. To evaluate the usability of the system, you need to create a representative list of tasks and evaluate the usability of those tasks according to following factors:
1. Speed (how quickly task can be accomplished)
2. Efficiency (how many mistakes are made in accomplishing the task)
3. Learnability (how easy is to learn to use the system)
4. Memorability (once learned, how easy is to remember how to use the system)
5. User Preference (what do users like?)
4. Tasks.. 
1. should NOT  be leading or descriptive (shouldn't have instructions what to do step by step)
2.  should NOT be too specific (shouldn't say like third link )
3. should NOT be a focus on least important  or rare elements than users will do (like checks list of authors of the website)
5. Mental models
1.  let understand how users perceive systems.
2. are used our experience and/or knowledge from all other parts of our life to  interact with new things. 
3. are important to understand as If we take these mental models into account when we're design software, we can build things that will be easier learn, remember and easier to use faster and more efficient.
6. A mental model is a combination of:
1. Affordances  (Affordances are things within a system that show a user how they're supposed to be used. 
2. Mapping
3. Visibility
4. Feedback
5. Constraints (how a system can prevent us from doing things that we shouldn't and how the design of it can encourage us to do things the right way.
7. There are much more to learn from this course but I forgot it already.

Conclusion

    It is a great course for people who are interested in UX. It is worth spend some time on readaing about basics of cognitive psychology and learn how memory works as It will help you learn much more from this course.

Coolpointer.015 : An Interesting UI design of volume control

What is Coolpointer ? Check this : http://dominiksymonowicz.blogspot.co.uk/2015/12/coolpointerintroduction.html

The worst volume control UI in the world
https://uxdesign.cc/the-worst-volume-control-ui-in-the-world-60713dc86950

        In this article Fabricio Teixeira shows an 'interesting' approaches to design  volume controls . Some of them indeed makes listening things ... adventurous. 
Worth to see if you have 3 minutes on your lunch break

Coolpointer.010: Why chinese website are so busy ?

What is Coolpointer ? Check this : http://dominiksymonowicz.blogspot.co.uk/2015/12/coolpointerintroduction.html

In article WHY DO CHINESE WEBSITES LOOK SO BUSY  by JEFF RAJECK explains why Chinese websites looks so different from western websites. He points out few things :

• Language difference. Jeff said that Asian pages use flash animation a lot to catch attention to user as language itself do not have this ability( This is due monolithic representation of characters)
• Another reason that author suggests is an internet speed. 
• It was truth in the past ,but it is not anymore.  In my opinion main reason is that this "ux pattern" that people learnt as way to find information. They go to this massive welcome page and using search functionality in browser they find information they look for . It was widely used on western website in late 90' like Yahoo ) .

So if you are interested in this subject, link is below :)

WHY DO CHINESE WEBSITES LOOK SO BUSY 
by JEFF RAJECK

https://econsultancy.com/blog/67466-why-do-chinese-websites-look-so-busy

FOLLOW AUTHOR:

TWITTER: https://twitter.com/jrajeck

What I learn from 12 presentation : 10 Usability Heuristics explained

I read slides from Jakob Nielsen  titled "10 Usability Heuristics explained", where he points out few very useful points about usability. It is worth to read for beginners as it show them basics elements to think about it when design system that will be easy to learn (and remember) and how to use quickly and efficiently to complete tasks. 

Jakob Nielsen is:

"A web usability consultant. He holds a Ph.D. in human–computer interaction from the Technical University of Denmark in Copenhagen."

Source: https://en.wikipedia.org/wiki/Jakob_Nielsen_(usability_consultant)

From Slides I learn:

• Status and communication from system should be always visible to user and should use user's language using common standards, being consistent and without technical gibberish. [Rules: "I know what's going on","I know what are you talking about","Seems familiar ,makes sense"]
• System guides user what to do next and what are consequences. For example. It  should prevent user from making mistakes or at least warn it about possible consequences of the action.  [Rules: "I know what's going on","Glad , I didn't do that"]
• System should always help user to recover if shit happens, so If user made a mistake, then system should have an ability to emergency stop/exit from current state. It should explain error in plain language and provide possible solution to recover . [Rules: "Oops, let's me outta of here","Glad , I didn't do that","I know what went wrong and I can fix it"]

10 usability heuristics according Jacob Nielson are:

• Visibility of system status ["I know what's going on"] 
• "The system should always keep user inform about what's going on through  feedback "
• In software development The system should always keep user inform about what's going on through  feedback.
• Match between system and the real world  ["I know what are you talking about"]
• System should speak user's language with vocabulary and concepts that user are familiar with.
• User control and freedom ["Oops, let's me outta of here"].
• User should have ability to emergency stop or exit ,if he made a mistake.
• This is reason why for example memento(known as undo/redo) pattern is important when we develop functionality as it helps undo problem.
• Consistency and standards ["Seems familiar ,makes sense"]
• Follow the convention ,so user doesn't need to figure out that different word ,actions does the same thing.
• It is important ,because it helps user to learn to use system quickly and efficiently.
• Error prevention ["Glad , I didn't do that"]
• It is good to eliminate possible error condition in first place ,where this is not feasibility ,then at least user should be warn and ask to confirm before he commit actions.
• Recognition instead of recall ["I know what I need to do here "]
• Minimize user memory's load  , user should remember enough to complete current action without remember about previous steps
• Flexibility and efficiency of use ["Allow me to do more or less "]
• Allow novice user to see essential data to make decision but allow to advanced user for customisation.
• Help user recognise,diagnose and recover from errors ["I know what went wrong and I can fix it "]
• Error messages should express in plain language and indicate the problem and provide suggestions to solve problem.
• Aesthetic and minimalist design [" Looks good , works beautifully "] Dialogue should contains only useful information. Any extra unit inform that are rarely any value or no value will reduce visibility.
• In my opinion design should fit audience. Aesthetic and minimalist design is good in generic cases but will not fit many cases. 
• Help and documentation ["Okay , I need help "]
• I don't have opinion about it. It is important to have tutorial to help user to teach basics skills need to find most information in intuitive way but documentation in general means System is too complicated (there are many cases when system is complicated because it performs very complicated tasks).

Resources:

Slides  -http://www.slideshare.net/crafted/10-usability-heuristics-explained

Coolpointer.006

What is Coolpointer ? Check this : http://dominiksymonowicz.blogspot.co.uk/2015/12/coolpointerintroduction.html

Interesting article about  naughty tricks that thisv
Newspaper overslept digital age revolution and they kick badly at the moment.

Dark Patterns by the Boston Globe

https://rationalconspiracy.com/2016/04/24/dark-patterns-by-the-boston-globe/

What I learn from 003: Jennifer Gove - Design principles for a better mobile web

Talk can be found be here: https://www.youtube.com/watch?v=xqviGwyy7y0

This talk was about an important principles when you design website that is optimised for mobile.It is  based on User Experience Research done by Google and AnswerLab.
I think, it is a mandatory talk to watch by anybody who is response in designing and developing website these days.

This is list of principles that I found most useful from this talk:

1. Describe a primary purpose for your site (key actions)
2. Menu short and sweet  (menu for desktop and mobile should be different)
3. Make easy to get back to homepage. (It sounds obvious but many 
4. Search is one of the most important component and on mobile due the restrictions that they have. It is  important that search contains features like auto completion , misspell correction, suggested result and ability to  filter  and sort or At least use Guide approach as pre-filter to narrow down results (start from selecting things like size,genger,category) .
5. Ensure that only relevant result are displayed. 
6. Don't require register upfront .. Allow  User to  browse and explorer before they make any commit. This is one of the stupidest marketing decision that some website took in my opinion.(I ,for example automatically leave website).
7. Allow buy as guest.
8. Allow user to pick-up from place,where it left.
9. Design efficient forms (and keep them to minimum) by Re-use or use pre-existing information ,provide visual calendars for dates and use real-time error validation (and keep error message inline and high light fields that are wrong.
10. Don't use pan and zoom. I noticed that 
11. Provide expandable /tappable images.
12. Be clear why you need a user's location. it is something new for me but after thoughts I agree, that  unexpected request for location can be suspicious.

I was aware of most principle but some of them was new (about location ,expandable /tappable images and allow user to pick-up from place,where it left.) so I believe ,this talk  will come useful for many of you.

Resources:

1. http://www.google.com/think/multiscreen/whitepaper-sitedesign.html?utm_source=session-design&utm_medium=slides&utm_term=chrome&utm_content=T95A7C&utm_campaign=io-14
2. https://developers.google.com/speed/pagespeed/insights/
3. https://developers.google.com/web/fundamentals/
4. https://www.youtube.com/watch?v=xqviGwyy7y0

What I learn from 002: C. Todd Lombardo - Fundamentals of Experience Design

I found a very interesting lecture about Fundamentals of Experience Design presented by  C. Todd Lombardo. Link: https://www.youtube.com/watch?v=1y5uPRfXdKY

It was really cool fast-paced lecture about basic principles. C. Todd Lombardo explained design as solving problem that meet people needed and it is usable by them. It describe goal of design are  Desirability,Feasibility  and Viability.

It talk about life-cycle of design,which he describes as:

• Discovery (Understanding the challenge, Prepare research, gather inspiration)
• Interpretation (Tell stories, search for meaning, frame opportunities)
• Ideation (Generate ideas, refine ideas)
• Experimentation )make prototypes, get feedback)
• Evolution (Track learnings ,move forward)

and he summarized his talk with  5 things to take away

1. Write down assumptions and challenge them 
2. Ask questions ... especially Why? Why not?
3. Think of the "WHOs and their sense(sight,hearing,taste,touch,smell)
4. Map the whole process - PRE-start to POST-finish
5. PARCC (proximity, alignment, repetition, contrast,colour)

It is worth to watch it, specially if you want understand fundamentals of design.

Source:

• https://www.youtube.com/watch?v=1y5uPRfXdKY
• http://paper-leaf.com/blog/2011/02/elements-of-design-quick-reference-sheet/

What I learnt from 001: Janne Jul Jensen - UX in an Agile Process

Talk can be found:  https://www.youtube.com/watch?v=NdqtTlCi4cE

Janne Jul Jensen is  UX researcher and Senior Interaction Designer who talked about case study with developing mobile application for one of the Danish Bank. It is worth to watch as it gives many interesting information about incorporating UX into Scrum methodology and how to dealing various problems caused by NDA during UX design.

What I found most useful was:

• UX should be visible part of SCRUM, so you need to include UX tasks in product backlog. Customer need to be aware of that part of process and be able to prioritise it. Why?  UX requires time and it costs money.It doesn't come for free. It is most important point from this talk for me as from my experience ... lack of this UX tasks cause many problems (no visibility to other teams and so on)
• UX should be one sprint ahead development.
• Product owner is response for prioritise UX.
• It is important to have visibility between UX, graphic designer, developers so you can set your mind set that is important to work in  parallel otherwise,you will end up with ... waterfall model.
• However ,it is important  to remember to not run iOS and Android developer in parallel to avoid duplication of the same mistakes. Development should starts from iOS and then Android . This is due fact that "Apple's censorship departament" need time to scan app before accept it.
• Don't applied iOS 'specific' on Android

Another useful thing that I learnt was how to test when you are limited by NDA:

•  Continuous test every sprint
•  internal testers
•  dedicated test time
•  test cases
•  automatic tests
•  expert  evaluations

UX'quote 001 - how to educate user?

Recommendation about how to educate user?

 " It depends very much on the user population. humans are a very diverse bunch. There are very cultural differences. There are many linguistic differences. I don't think that there is a one size fit all.(...) So it is an solved problem.You have variability in human psyche. " - Stephan Somogyi

User Experience ( UI , UX ) notes:

UX is an acronym for "user experience"


DEFINITION:
Best definition can be found here: http://www.helloerik.com/ux-is-not-ui


USEFUL ARTICLES:

• About Hamburger Menu
• http://lmjabreu.com/post/why-and-how-to-avoid-hamburger-menus/
• About Golden Ratio
•  http://en.wikipedia.org/wiki/Golden_ratio
•  Introduction to Usability by Jakob Nielsen
• http://www.nngroup.com/articles/usability-101-introduction-to-usability/
•  User Interface (UX) Techniques by Janne Jul Jensen
• http://lnkd.in/YxRKQm 
• UX Design: An Introduction by Scout Stevenson
• http://lnkd.in/987zK8
• Dropdown
• www.lukew.com/ff/entry.asp?1950
• About 10 Usability Heuristics by 
• http://www.slideshare.net/crafted/10-usability-heuristics-explained

All useful material that I found can are here:
http://dominiksymonowicz.blogspot.co.uk/search/label/ux

UI design :User is drunk by Will Dayble

Will Dayble gave a very interesting talks about how to designing for users.
http://www.youtube.com/watch?v=r2CbbBLVaPk

Notes:

• What is a interface? Where two things meet.
• If you can make UI poor ,so people do not realizes, that they are there.They will use them more efficiently.
• Guide them through process as they are blindly drunk.you will get real approx. of average user is like.
• If is any doubt,say it twice.(confirmation)
• Drink martini and test  ;)

Useful webinar: UX Design: An Introduction by Scout Stevenson

I found another amazing seminar about user experience design  on  Harvard i-lab's YouTube page.

Link: http://www.youtube.com/watch?v=WkUwbPdyMIY

You will learn A LOT from  Scout Stevenson's presentation as he  provider a lot valuable information about whole cycle of  as he is experienced   UX process from start to end. Must watch video for people who want learn a lot from very experienced man.

This is description from Youtube:

"User Experience is more than creating a slick web page. It's about understanding your users and aligning their behaviors, goals and motivations with your business strategy. This presentation will outline best practices surrounding the process and deliverables that are vital components for creating a positive user experiences.

Scout Stevenson is the creative director at ExtensionEngine where he and his team take a strategic approach in developing creative marketing solutions that engage users visually while driving business results. Prior, he was Co-founder and Creative Director of Jetpak Media which was recently acquired by ExtensionEngine. Throughout his 17 year career, he has built and led creative teams at numerous top Boston agencies. Scout is an adjunct professor at Boston University's College of Fine Arts where he lectures on web and experience design. He has won numerous industry awards for both B2C and B2B creative campaigns and is a MITX judge. "

MY NOTES FROM WEBINAR

Below you can find my notes that I made from presentation (copied from slides mostly).

-------------    -------------     -------------    -------------

User experience is the quality of experience a person has when interacting with a specific product A positive user experience results when the goals of the user and the organization that created the product are met.

-------------    -------------     -------------    -------------

Business goals + user goals + user interface + technology = user experience

-------------    -------------     -------------    -------------

the 5 plans of ux
from abstract to concrete
1.Strategy - 2.scope - 3.structure - 4.skeleton - 5.surface

Tasks for each level
1. Strategy (user needs , site objective)
2. Scope  (functional specs, content requirements
3. interaction design and information architecture
4. information design , interface design , navigation design,
5. visual design

-------------    -------------     -------------    -------------

1. - What is a the big goal ?
- What user want?
- What business wannt ?

2. Scope
- Migration of strategy to requirements
- Developing task and user stories - what
- Knowing the user and pribidng the righ task.

3. Structure
- where we start to develop the taxonomy
- how do all the pieces pf tje sote start to fit together and behave?
- how does the user find what they're looking for in an intutive way?
- what is the flow of actions and interactions thorought the site?

4. Skeleton
 - this is where we solidify the structure - what elements are on what page?
- where does the button go?
- how much copy is there?
 - what types of call to actions are there ?
 - wire frames are the ' blueprints ' for a site and are void of design

5. Surface
- visual interface layer ,that ties all the other components together
- content and tone
- color and typeface
- brand and personality
- imagery .. buttons
(all graphical goodness come

-------------    -------------     -------------    -------------

UX Process vary as it depends on:
- product type
- target

Extensionengine ux process
I) research , II) strategy , III) implement IV)deploy V)measure,optimize

I) RESEARCH - analyse customer and user behaviours and goals
brand and product immersion , set vision , usability analysis , user profiles , content audit , competitive analysis

II) STRATEGY - translating strategic vision into requirements
ux strategy , ideation working sessions , requirements gathering , persona development , user flows stories and tasks

III) IMPLEMENT - prototype , iterate build and design
development , story boarding , information architecture , prototypes/ concepts , visual design

IV) DEPLOY - test , review and launch
beta testing , review objectives , usability testing ,user interviews

V) MEASURE, OPTIMIZE - measure , iterate and re-deploy
review metrics , iterate design , re-deploy iterate code

-------------    -------------     -------------    -------------

Useful webinar: User Interface (UX) Techniques - Janne Jul Jensen

I am slowly starts collecting various webinars, seminars ,links and  material about that i read ,listen and/or watch about User Experience as I planning learn it.

This is a very interesting seminar that I found on YouTube.
Janne Jul Jensen - User Interface (UX) Techniques
http://www.youtube.com/watch?v=7OSkB4BCx00

This seminars explains about how looks good usability:

1. Simple and natural dialogue
2. Speak the user's language
3. Minimize memory load (for example multi-step buying process instead of one enormous form)
4. Use constructive error messages
5. Support recall
6. Make clear exists
7. Make shortcuts
8. Give feedback (to user about what is going on is good/back/info)
9. Prevent errors
10. Thrive for consistency

It get some interesting information how creative design workshop should looks like (6-12 people in 2-4 groups )

Each groups must have:

• Desingers
• Domain expercs
• Users
• Developers

and shows some examples.

I learn some useful bits from this seminar and It is worth to watch and larn as it has with lots of useful information even for beginners like me.

This is video description from YouTube:

"Video from  GOTO Here's a description of Janne's talk from GOTO Aarhus 2012: Most developers today are aware of the importance of creating a good user interface with a high level of usability, but many are lacking the methods and techniques that can help in this process. This session will present to the listeners a range of concrete methods and techniques applicable in different phases of a design process, to handle specific challenges. This will include design patterns, personas, wire framing, paper prototype testing, progressive disclosure, card sorting and creative workshops and many of the methods and techniques will be accompanied by examples."

Useful link: article UX is not UI by Erik.

UX
I found today a interesting blog entry written by Erik about difference between User Experience (UX) and User Inteface design (UI).

It is shame, that due lack of time I cannot afford to spent some time on  UX  as it is fantastic topic from me as it mix my work (Software development) with my hobby( psychology). I hope to carry on reading about UX from time to time at least.
User Experience is a one of the most import
It takes a lot o


Link to article: http://www.helloerik.com/ux-is-not-ui
Link to 2-column UX/UI comparison from above article UX is not UI. http://www.uxisnotui.com/
Link to Erik's website: http://www.helloerik.com/

Useful link: how to design message box/pop-up/window to cofirm to perform action.

Interesting post about  how to design  message box/pop-up/window to confirm to perform action.

Most important conclusion is

• Always Use Verbs as Button Labels

Links:
http://ux.stackexchange.com/questions/9946/should-i-use-yes-no-or-ok-cancel-on-my-message-box
http://ignorethecode.net/blog/2008/10/31/nobody-reads/

Useful link: Article about Android Usability

You can find bunch of useful information about by UI design and usability for Android devices written    by Juhani Lehtimaki on JavaLobby

http://java.dzone.com/articles/what-should-android-apps-look