Skip to content

Interactive Applications Design (07_O-CAI)

  • Coefficient : 6
  • Hourly Volume: 150h (including 72h supervised)
    CTD : 31.5h supervised
    Labo : 40.5h supervised (and 12h unsupervised)
    Out-of-schedule personal work : 66h
  • Including project : 18h supervised and 24h unsupervised project

AATs Lists

  1. Human-Machine Interfaces (HMI):
    • know how to define HMI and its challenges
    • know the principles of design, creation and evaluation of interactive applications from the perspective of User Centered Design (UCD)
    • paper and wireframe prototyping
  2. WEB developments:
    • Set up a WEB application (HTML, CSS and JavaScript) from the projects designed in the “Human-Machine Interfaces” section.
  3. WIMP interfaces:
    • know how to implement a WIMP (Window Icon Menu Pointer) type HMI using an object-oriented programming language and a library of graphical components.
    • master best practices for developing interactive applications.
    • know how to apply design patterns (design pattern Observer and MVC) for programming an HMI.
  4. Android programming:
    • Learn to develop Android applications: environment, principles, graphical interface
    • Learn to manage peripherals (sensors, bluetooth, SMS)
    • Learn how to publish and monetize your Android application

Learning Outcomes AAv (AAv)

  • AAv1 [heures: 13, A1,G2] : At the end of the "Interactive Application Design" module, students are able to RECALL the fundamental principles (definition, history and issues) of Human-Computer Interaction and (approach , steps, methods) of User Centered Design in their own words and examples

  • AAv2 [heures: 32, A3,C2,G2] : At the end of the “Interactive Application Design” module, students are able to APPLY the iterative approach, the different stages and an example of an associated method, from the design user-centered

  • AAv3 [heures: 45, C2,D1] : At the end of the “Interactive Application Design” module, students are able to DESIGN HMIs that meet the needs of targeted users

  • AAv4 [heures: 38, D1,D4] : At the end of the "Interactive Application Design" module, students are able to PRODUCE an HMI (based on the principles of event-driven programming) using different libraries of graphic components, by respecting the requested specifications and making them aware of basic ergonomic criteria (example: guidance, control, adaptability)

  • AAv5 [heures: 26, C1,C2] : At the end of the “Interactive Application Design” module, students are able to STRUCTURE an HMI by applying design patterns (Observer, MVC). The HMI produced from these design patterns must be reusable (evolution of models, adaptation of views, addition of controllers).

  • AAv6 [heures: 26, C2,D1] : At the end of the "Interactive Application Design" module, students are able to USE native functionality libraries (sensors, vibrators) on mobile devices and integrate them into a HMI.

Assessment methods

  • Eval_AAv1 : During the 4 weeks of CCU, students will have to produce a design file recalling the fundamental principles of HMI and CCU
  • Eval_AAv2_a : During the 4 weeks of CCU, students will have to produce a design file implementing a method for each of the stages of the User-Centered Design approach
  • Eval_AAv2_b : During the last half-day of CCU, students will have to make an oral presentation of their work to the whole class
  • Eval_AAv3_a : During the last 2 weeks of CCU, students will have to prototype (sketch + wireframe + prototype) an interface meeting user needs in a context chosen and defined beforehand by the group (~4 students) or by the class ( ~24 students)
  • Eval_AAv3_b : During the 3 weeks of WEB, students will have to design the interfaces of their prototype from the CCU using HTML, CSS and JS languages ​​AND present the result of their work in a report
  • Eval_AAv4 : students receive a specification of HMI and functionalities to be implemented based on a library of graphic components and an initial development framework.
  • Eval_AAv5 : students receive a specification of HMI and functionalities to be implemented while respecting the design patterns studied in class.
  • Eval_AAv6 : Students receive instructions on the use of sensors under Android and must design a mobile application integrating a graphical interface to demonstrate the use of several native sensors.

Key Words

Human-System Interaction, User-Centered Design, Persona, event-driven programming, WIMP, Post-WIMP interfaces, Observer MVC design pattern, android programming, WEB development, HTML, CSS, Javascript

Prerequisites

Imperative and object-oriented programming, UML modeling.

Resources

“Conception d’applications interactives” on Moodle ENIB.