Input and Interaction

بواسطة: Coursera

Overview

In this course, you will learn relevant fundamentals of human motor performance, perception, and cognition that inform effective interaction design. You will use these models of how people work to design more effective input and interaction techniques. You’ll apply these to both traditional graphic and gestural interfaces.

Syllabus

  • Input
    • There’s more to interfaces than what’s on the screen. While often overlooked, input deserves to be on equal footing with its more popular sibling, output. Also, input is a rare case where we can model user behavior mathematically. In this module, you’ll learn how good input is more than just preference, trace input from the fingertip to the screen, and think about the diversity of possible input devices and their relative merits.
  • Search & Navigation
    • We live in an information-rich world. Consequently, the hardest part of interaction is often finding what we want or finding something that we didn’t know what to ask for. From e-commerce to digital libraries, good search design is central to human-computer interaction in the 21st century.
  • Gestural Interfaces
    • The graphical user interface with windows, icons, menus, and pointers (WIMP) was a massive advance beyond the command line. It also took 20 years to go from research labs into people’s homes. We’re in the midst of a new sea change now. Gestural interfaces can be even more direct and more natural. They can also be even more frustrating. In this module, you’ll learn how to tell the difference and design gestural interfaces that work.

Taught by

Scott Klemmer

Input and Interaction
الذهاب الي الدورة

Input and Interaction

بواسطة: Coursera

  • Coursera
  • مجانية
  • الإنجليزية
  • متاح شهادة
  • متاح في أي وقت
  • الجميع
  • Arabic, French, Portuguese, Chinese, Italian, German, Russian, English, Spanish, Thai, Indonesian, Kazakh, Hindi, Swedish, Korean, Greek, Ukrainian, Japanese, Polish, Dutch, Turkish
8.1.2PHP Version893msRequest Duration2MBMemory UsageGET ar/الدورات/{slug}Route
    • Booting (577ms)
    • Application (314ms)
    • 1 x Booting (64.62%)
      577.20ms
      1 x Application (35.13%)
      313.78ms
      14 templates were rendered
      • public.courses.show (resources/views/public/courses/show.blade.php)3bladefile
        Params
        0
        course
        1
        links
        2
        config
      • public.courses.partials.breadcrumbs (resources/views/public/courses/partials/breadcrumbs.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.courses.partials.heading (resources/views/public/courses/partials/heading.blade.php)7bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
        6
        classes
      • public.courses.partials.details (resources/views/public/courses/partials/details.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.courses.partials.breadcrumbs (resources/views/public/courses/partials/breadcrumbs.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.courses.partials.heading (resources/views/public/courses/partials/heading.blade.php)7bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
        6
        classes
      • public.layouts.main (resources/views/public/layouts/main.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.layouts.partials.meta (resources/views/public/layouts/partials/meta.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.layouts.partials.navbar (resources/views/public/layouts/partials/navbar.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.auth.profile.partials.links (resources/views/public/auth/profile/partials/links.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.auth.profile.partials.link (resources/views/public/auth/profile/partials/link.blade.php)8bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
        6
        route
        7
        title
      • public.auth.profile.partials.link (resources/views/public/auth/profile/partials/link.blade.php)8bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
        6
        route
        7
        title
      • public.auth.profile.partials.link (resources/views/public/auth/profile/partials/link.blade.php)8bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
        6
        route
        7
        title
      • public.layouts.partials.flash-session (resources/views/public/layouts/partials/flash-session.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      uri
      GET ar/الدورات/{slug}
      middleware
      web, localize:ar
      controller
      App\Http\Controllers\CourseController@show
      as
      ar.courses.show
      namespace
      prefix
      /ar
      where
      file
      app/Http/Controllers/CourseController.php:17-35
      7 statements were executed8.41ms
      • select * from `courses` where `slug_ar` = 'input-and-interaction' limit 1
        5.53ms/app/Http/Controllers/CourseController.php:20corspedia
        Metadata
        Bindings
        • 0. input-and-interaction
        Backtrace
        • 17. /app/Http/Controllers/CourseController.php:20
        • 18. /vendor/laravel/framework/src/Illuminate/Routing/Controller.php:54
        • 19. /vendor/laravel/framework/src/Illuminate/Routing/ControllerDispatcher.php:43
        • 20. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:260
        • 21. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:205
      • update `courses` set `visitors` = `visitors` + 1, `courses`.`updated_at` = '2025-07-13 14:08:55' where `id` = 136
        1.69ms/app/Http/Controllers/CourseController.php:21corspedia
        Metadata
        Bindings
        • 0. 2025-07-13 14:08:55
        • 1. 136
        Backtrace
        • 17. /app/Http/Controllers/CourseController.php:21
        • 18. /vendor/laravel/framework/src/Illuminate/Routing/Controller.php:54
        • 19. /vendor/laravel/framework/src/Illuminate/Routing/ControllerDispatcher.php:43
        • 20. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:260
        • 21. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:205
      • select `id`, `name_en`, `name_ar`, `topic_id`, `slug_en`, `slug_ar` from `subjects` where `subjects`.`id` in (26)
        240μs/app/Http/Controllers/CourseController.php:23corspedia
        Metadata
        Backtrace
        • 20. /app/Http/Controllers/CourseController.php:23
        • 21. /vendor/laravel/framework/src/Illuminate/Routing/Controller.php:54
        • 22. /vendor/laravel/framework/src/Illuminate/Routing/ControllerDispatcher.php:43
        • 23. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:260
        • 24. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:205
      • select `id`, `name_en`, `name_ar`, `slug_en`, `slug_ar` from `topics` where `topics`.`id` in (1)
        210μs/app/Http/Controllers/CourseController.php:23corspedia
        Metadata
        Backtrace
        • 25. /app/Http/Controllers/CourseController.php:23
        • 26. /vendor/laravel/framework/src/Illuminate/Routing/Controller.php:54
        • 27. /vendor/laravel/framework/src/Illuminate/Routing/ControllerDispatcher.php:43
        • 28. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:260
        • 29. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:205
      • select * from `institutions` where `institutions`.`id` in (19) and `institutions`.`deleted_at` is null
        240μs/app/Http/Controllers/CourseController.php:23corspedia
        Metadata
        Backtrace
        • 20. /app/Http/Controllers/CourseController.php:23
        • 21. /vendor/laravel/framework/src/Illuminate/Routing/Controller.php:54
        • 22. /vendor/laravel/framework/src/Illuminate/Routing/ControllerDispatcher.php:43
        • 23. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:260
        • 24. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:205
      • select * from `providers` where `providers`.`id` in (2) and `providers`.`deleted_at` is null
        250μs/app/Http/Controllers/CourseController.php:23corspedia
        Metadata
        Backtrace
        • 20. /app/Http/Controllers/CourseController.php:23
        • 21. /vendor/laravel/framework/src/Illuminate/Routing/Controller.php:54
        • 22. /vendor/laravel/framework/src/Illuminate/Routing/ControllerDispatcher.php:43
        • 23. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:260
        • 24. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:205
      • select * from `html_files` where `html_files`.`id` = 136 limit 1
        250μs/app/Models/Course.php:84corspedia
        Metadata
        Bindings
        • 0. 136
        Backtrace
        • 21. /app/Models/Course.php:84
        • 28. view::public.courses.show:29
        • 30. /vendor/laravel/framework/src/Illuminate/Filesystem/Filesystem.php:125
        • 31. /vendor/laravel/framework/src/Illuminate/View/Engines/PhpEngine.php:58
        • 32. /vendor/laravel/framework/src/Illuminate/View/Engines/CompilerEngine.php:72
      App\Models\HtmlFile
      1
      App\Models\Provider
      1
      App\Models\Institution
      1
      App\Models\Topic
      1
      App\Models\Subject
      1
      App\Models\Course
      1
        _token
        JI9KfgahnOSIWUQrQ7GaTLXo2mDKeVeVaMzp4Epx
        locale
        ar
        _previous
        array:1 [ "url" => "https://www.corspedia.com/ar/%D8%A7%D9%84%D8%AF%D9%88%D8%B1%D8%A7%D8%AA/input-...
        _flash
        array:2 [ "old" => [] "new" => [] ]
        PHPDEBUGBAR_STACK_DATA
        []
        path_info
        /ar/%D8%A7%D9%84%D8%AF%D9%88%D8%B1%D8%A7%D8%AA/input-and-interaction
        status_code
        200
        
        status_text
        OK
        format
        html
        content_type
        text/html; charset=UTF-8
        request_query
        []
        
        request_request
        []
        
        request_headers
        0 of 0
        array:24 [ "cf-ipcountry" => array:1 [ 0 => "US" ] "cf-connecting-ip" => array:1 [ 0 => "216.73.216.10" ] "cdn-loop" => array:1 [ 0 => "cloudflare; loops=1" ] "x-forwarded-proto" => array:1 [ 0 => "https" ] "x-forwarded-for" => array:1 [ 0 => "216.73.216.10" ] "sec-fetch-site" => array:1 [ 0 => "none" ] "accept" => array:1 [ 0 => "text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7" ] "user-agent" => array:1 [ 0 => "Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com)" ] "upgrade-insecure-requests" => array:1 [ 0 => "1" ] "sec-ch-ua-platform" => array:1 [ 0 => ""Windows"" ] "sec-ch-ua-mobile" => array:1 [ 0 => "?0" ] "sec-ch-ua" => array:1 [ 0 => ""Chromium";v="130", "HeadlessChrome";v="130", "Not?A_Brand";v="99"" ] "cache-control" => array:1 [ 0 => "no-cache" ] "pragma" => array:1 [ 0 => "no-cache" ] "sec-fetch-dest" => array:1 [ 0 => "document" ] "cf-ray" => array:1 [ 0 => "95e95ae2ef8736da-YYZ" ] "accept-encoding" => array:1 [ 0 => "gzip, br" ] "priority" => array:1 [ 0 => "u=0, i" ] "sec-fetch-user" => array:1 [ 0 => "?1" ] "sec-fetch-mode" => array:1 [ 0 => "navigate" ] "cf-visitor" => array:1 [ 0 => "{"scheme":"https"}" ] "host" => array:1 [ 0 => "www.corspedia.com" ] "content-length" => array:1 [ 0 => "" ] "content-type" => array:1 [ 0 => "" ] ]
        request_server
        0 of 0
        array:50 [ "USER" => "www-data" "HOME" => "/var/www" "HTTP_CF_IPCOUNTRY" => "US" "HTTP_CF_CONNECTING_IP" => "216.73.216.10" "HTTP_CDN_LOOP" => "cloudflare; loops=1" "HTTP_X_FORWARDED_PROTO" => "https" "HTTP_X_FORWARDED_FOR" => "216.73.216.10" "HTTP_SEC_FETCH_SITE" => "none" "HTTP_ACCEPT" => "text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7" "HTTP_USER_AGENT" => "Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com)" "HTTP_UPGRADE_INSECURE_REQUESTS" => "1" "HTTP_SEC_CH_UA_PLATFORM" => ""Windows"" "HTTP_SEC_CH_UA_MOBILE" => "?0" "HTTP_SEC_CH_UA" => ""Chromium";v="130", "HeadlessChrome";v="130", "Not?A_Brand";v="99"" "HTTP_CACHE_CONTROL" => "no-cache" "HTTP_PRAGMA" => "no-cache" "HTTP_SEC_FETCH_DEST" => "document" "HTTP_CF_RAY" => "95e95ae2ef8736da-YYZ" "HTTP_ACCEPT_ENCODING" => "gzip, br" "HTTP_PRIORITY" => "u=0, i" "HTTP_SEC_FETCH_USER" => "?1" "HTTP_SEC_FETCH_MODE" => "navigate" "HTTP_CF_VISITOR" => "{"scheme":"https"}" "HTTP_HOST" => "www.corspedia.com" "REDIRECT_STATUS" => "200" "SERVER_NAME" => "corspedia.com" "SERVER_PORT" => "443" "SERVER_ADDR" => "141.95.147.152" "REMOTE_USER" => "" "REMOTE_PORT" => "21280" "REMOTE_ADDR" => "172.69.214.243" "SERVER_SOFTWARE" => "nginx/1.18.0" "GATEWAY_INTERFACE" => "CGI/1.1" "HTTPS" => "on" "REQUEST_SCHEME" => "https" "SERVER_PROTOCOL" => "HTTP/2.0" "DOCUMENT_ROOT" => "/var/www/corspedia/public" "DOCUMENT_URI" => "/index.php" "REQUEST_URI" => "/ar/%D8%A7%D9%84%D8%AF%D9%88%D8%B1%D8%A7%D8%AA/input-and-interaction" "SCRIPT_NAME" => "/index.php" "CONTENT_LENGTH" => "" "CONTENT_TYPE" => "" "REQUEST_METHOD" => "GET" "QUERY_STRING" => "" "SCRIPT_FILENAME" => "/var/www/corspedia/public/index.php" "PATH_INFO" => "" "FCGI_ROLE" => "RESPONDER" "PHP_SELF" => "/index.php" "REQUEST_TIME_FLOAT" => 1752415734.4951 "REQUEST_TIME" => 1752415734 ]
        request_cookies
        []
        
        response_headers
        0 of 0
        array:5 [ "content-type" => array:1 [ 0 => "text/html; charset=UTF-8" ] "cache-control" => array:1 [ 0 => "no-cache, private" ] "date" => array:1 [ 0 => "Sun, 13 Jul 2025 14:08:55 GMT" ] "set-cookie" => array:2 [ 0 => "XSRF-TOKEN=eyJpdiI6Ilh4Yjl5akpMM2h1cy9CL2hrems3R0E9PSIsInZhbHVlIjoiY1JoQ25vZG5vZG1VR2VnMmVlVFVqZ0lsTWcrQ2s1ZmNZTzBWV2pqMGQzUG5RTFphRjl0cjk5YVY4STJDWnBLVmZQRXpVb2NDbWRkZDRFZCtiaUxvN0lZMGV2dHVhTU5IRVI3d2NZcU5CWnZSeUpuRFpELzh6b25CWHNsdi9aemsiLCJtYWMiOiI4MmYxNTNiODg5ZWRmYzQ1YTVkNzIyMjIwOTg5ZjQ4ZWRmNTZmZTlhNzYzZTU4ZWYxYzI0NGQyOTNlYjEzYTc2IiwidGFnIjoiIn0%3D; expires=Sun, 13 Jul 2025 16:08:55 GMT; Max-Age=7200; path=/; samesite=laxXSRF-TOKEN=eyJpdiI6Ilh4Yjl5akpMM2h1cy9CL2hrems3R0E9PSIsInZhbHVlIjoiY1JoQ25vZG5vZG1VR2VnMmVlVFVqZ0lsTWcrQ2s1ZmNZTzBWV2pqMGQzUG5RTFphRjl0cjk5YVY4STJDWnBLVmZQRXpVb" 1 => "laravel_session=eyJpdiI6IkhuZGg3UGxtdnV5Vk41VG9iazQ4dHc9PSIsInZhbHVlIjoiRzFibE1CM3JtdnZLeGVIUVEyblNoQUkxcW1ZNUp5ZWFLVHo0U2wwSzBaTWtnVEwzQ3ozaVlqUTNZMElVOGo2VG9UMTlqNkNzaHRmUGRFRGpaQ0QrbmJSVGc2SXNWZlpJVXJxaHJXcmlKYmZBRUszd0FFV2N0Z1RxK3E0S2l2UGkiLCJtYWMiOiI4NjMxMmU3ODg1NTJkYWVkNGMyYTZjOWM5NDVmNDYxOTI5OGFhMzc5NjZkNjNiOTcxMjQ1YzU0YWRmMTUwOGYzIiwidGFnIjoiIn0%3D; expires=Sun, 13 Jul 2025 16:08:55 GMT; Max-Age=7200; path=/; httponly; samesite=laxlaravel_session=eyJpdiI6IkhuZGg3UGxtdnV5Vk41VG9iazQ4dHc9PSIsInZhbHVlIjoiRzFibE1CM3JtdnZLeGVIUVEyblNoQUkxcW1ZNUp5ZWFLVHo0U2wwSzBaTWtnVEwzQ3ozaVlqUTNZMElVOGo2VG9U" ] "Set-Cookie" => array:2 [ 0 => "XSRF-TOKEN=eyJpdiI6Ilh4Yjl5akpMM2h1cy9CL2hrems3R0E9PSIsInZhbHVlIjoiY1JoQ25vZG5vZG1VR2VnMmVlVFVqZ0lsTWcrQ2s1ZmNZTzBWV2pqMGQzUG5RTFphRjl0cjk5YVY4STJDWnBLVmZQRXpVb2NDbWRkZDRFZCtiaUxvN0lZMGV2dHVhTU5IRVI3d2NZcU5CWnZSeUpuRFpELzh6b25CWHNsdi9aemsiLCJtYWMiOiI4MmYxNTNiODg5ZWRmYzQ1YTVkNzIyMjIwOTg5ZjQ4ZWRmNTZmZTlhNzYzZTU4ZWYxYzI0NGQyOTNlYjEzYTc2IiwidGFnIjoiIn0%3D; expires=Sun, 13-Jul-2025 16:08:55 GMT; path=/XSRF-TOKEN=eyJpdiI6Ilh4Yjl5akpMM2h1cy9CL2hrems3R0E9PSIsInZhbHVlIjoiY1JoQ25vZG5vZG1VR2VnMmVlVFVqZ0lsTWcrQ2s1ZmNZTzBWV2pqMGQzUG5RTFphRjl0cjk5YVY4STJDWnBLVmZQRXpVb" 1 => "laravel_session=eyJpdiI6IkhuZGg3UGxtdnV5Vk41VG9iazQ4dHc9PSIsInZhbHVlIjoiRzFibE1CM3JtdnZLeGVIUVEyblNoQUkxcW1ZNUp5ZWFLVHo0U2wwSzBaTWtnVEwzQ3ozaVlqUTNZMElVOGo2VG9UMTlqNkNzaHRmUGRFRGpaQ0QrbmJSVGc2SXNWZlpJVXJxaHJXcmlKYmZBRUszd0FFV2N0Z1RxK3E0S2l2UGkiLCJtYWMiOiI4NjMxMmU3ODg1NTJkYWVkNGMyYTZjOWM5NDVmNDYxOTI5OGFhMzc5NjZkNjNiOTcxMjQ1YzU0YWRmMTUwOGYzIiwidGFnIjoiIn0%3D; expires=Sun, 13-Jul-2025 16:08:55 GMT; path=/; httponlylaravel_session=eyJpdiI6IkhuZGg3UGxtdnV5Vk41VG9iazQ4dHc9PSIsInZhbHVlIjoiRzFibE1CM3JtdnZLeGVIUVEyblNoQUkxcW1ZNUp5ZWFLVHo0U2wwSzBaTWtnVEwzQ3ozaVlqUTNZMElVOGo2VG9U" ] ]
        session_attributes
        0 of 0
        array:5 [ "_token" => "JI9KfgahnOSIWUQrQ7GaTLXo2mDKeVeVaMzp4Epx" "locale" => "ar" "_previous" => array:1 [ "url" => "https://www.corspedia.com/ar/%D8%A7%D9%84%D8%AF%D9%88%D8%B1%D8%A7%D8%AA/input-and-interaction" ] "_flash" => array:2 [ "old" => [] "new" => [] ] "PHPDEBUGBAR_STACK_DATA" => [] ]