index.html (4118B)
1 <html> 2 <head> 3 <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/highlight.min.js"></script> 4 <script type="text/javascript" async src="https://cdn.jsdelivr.net/gh/mathjax/MathJax@2.7.5/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script> 5 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/styles/default.min.css"> 6 <link rel="Stylesheet" type="text/css" href="style.css" /> 7 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 8 <script> 9 document.addEventListener('DOMContentLoaded', function() { 10 document.querySelectorAll('pre.code').forEach(function(item) { 11 hljs.highlightBlock(item) 12 }) 13 }); 14 </script> 15 <title>index</title> 16 </head> 17 <body> 18 <style type="text/css"> 19 nav a { 20 text-align: left; 21 } 22 nav #name { 23 text-align: right; 24 float: right; 25 font-style: italic; 26 } 27 </style> 28 <nav> 29 <a href="index.html">Index</a> 30 <span id="name">Alex Balgavy</span> 31 </nav> 32 <hr> 33 <div class="content"> 34 35 <div id="Human Computer Interaction"><h1 id="Human Computer Interaction" class="header"><a href="#Human Computer Interaction">Human Computer Interaction</a></h1></div> 36 <p> 37 HCI is concerned with design, evaluation, implementation of interactive computer systems 38 </p> 39 40 <p> 41 how people use software & computing devices. usability engineering: 42 </p> 43 <ul> 44 <li> 45 design 46 47 <li> 48 evaluation 49 50 <li> 51 implementation of interactive computing systems 52 53 </ul> 54 55 <p> 56 why is it important? because sites have shitty UIs and UXs. and we've all had to use them. and it sucks. 57 </p> 58 59 <p> 60 website metrics: volume of business, num of unique visitors, conversion rate from visitor to customer, loyalty rate, bounce rate, pages viewed per visit 61 </p> 62 63 <p> 64 business metrics: conversion rates, traffic numbers, user performance, target feature usage 65 </p> 66 67 <p> 68 Table of contents: 69 </p> 70 <ol> 71 <li> 72 <a href="user-experience-elements.html#User experience (UX) elements">User experience (UX) elements</a> 73 74 <li> 75 <a href="norman's-design-principles.html#Norman's design principles">Norman's design principles</a> 76 77 <li> 78 <a href="usability-principles.html#Usability principles">Usability principles</a> 79 80 <li> 81 <a href="prototypes.html#Prototypes">Prototypes</a> 82 83 <ul> 84 <li> 85 <a href="prototypes.html#Prototypes-Designing the prototype">Designing the prototype</a> 86 87 </ul> 88 <li> 89 <a href="personas,-scenarios,-and-use-cases.html#Personas, Scenarios, and use cases">Personas, Scenarios, and use cases</a> 90 91 <ul> 92 <li> 93 <a href="personas,-scenarios,-and-use-cases.html#Personas, Scenarios, and use cases-Goal directed design">Goal directed design</a> 94 95 <li> 96 <a href="personas,-scenarios,-and-use-cases.html#Personas, Scenarios, and use cases-Personas - archetypal users">Personas - archetypal users</a> 97 98 <li> 99 <a href="personas,-scenarios,-and-use-cases.html#Personas, Scenarios, and use cases-Scenarios">Scenarios</a> 100 101 <li> 102 <a href="personas,-scenarios,-and-use-cases.html#Personas, Scenarios, and use cases-Design Requirements & principles">Design Requirements & principles</a> 103 104 <li> 105 <a href="personas,-scenarios,-and-use-cases.html#Personas, Scenarios, and use cases-Use Case">Use Case</a> 106 107 </ul> 108 <li> 109 <a href="webpage-design.html#Webpage design">Webpage design</a> 110 111 <li> 112 <a href="designing-for-differences.html#Designing for differences">Designing for differences</a> 113 114 <ul> 115 <li> 116 <a href="designing-for-differences.html#Designing for differences-Ergonomics">Ergonomics</a> 117 118 <li> 119 <a href="designing-for-differences.html#Designing for differences-Computers for older people">Computers for older people</a> 120 121 <li> 122 <a href="designing-for-differences.html#Designing for differences-Computers for kids">Computers for kids</a> 123 124 <li> 125 <a href="designing-for-differences.html#Designing for differences-Web page guidelines">Web page guidelines</a> 126 127 <ul> 128 <li> 129 <a href="designing-for-differences.html#Designing for differences-Web page guidelines-Web Content Accessibility Guidelines (WCAG, W3C initiative)">Web Content Accessibility Guidelines (WCAG, W3C initiative)</a> 130 131 </ul> 132 </ul> 133 </ol> 134 135 </div> 136 </body> 137 </html>