SlideShare ist ein Scribd-Unternehmen logo
1 von 14
Model-based Design and Generation of a
   Gesture-based User Interface Navigation
                  Control
  Sebastian Feuerstack, Mauro dos Santos Anjo, and Ednaldo Pizzolato


Dr.-Ing. Sebastian Feuerstack
Universidade Federal de São Carlos
Departamento de Computacão

  4. November 2011                        Sebastian Feuerstack I Sebastian@Feuerstack.org
Basic Question


              How to model and run
              multimodal interaction
               prototype variants ?

4. November 2011                       2
Why modeling?
  • One (visual) language that
        – is declarative and precise to discuss &
          execute
        – Is located between a tool and source code
        – Supports different forms of interaction and
          flexible prototyping of multimodal interfaces

4. November 2011                                     3
What is state of the art ?
1.     Task         AUI             CUI             FUI

                                    CUI             FUI


2.      Widget
                          W1              W2
        Alg.

                               A1              D1
        Driver

 4. November 2011                                         4
Use Case: Test and Evaluation
              Gesture-based Interface Navigation
:IN:hand_gestures
                             NoHands

               [one_hand]             [no_hands]

                                                 OneHand

     Navigation                                                                                            previous /         next /
                                    Predecessor                                       Command
                                                                                                          closer / farer   closer /farer
     Ticker           tick         previous                                    wait_one
                                                       start_p
     started                                    tick              previous
                                                                             select          confirmed
                            next
      [1s]/tick                               previous
                                                                  next            selected    [confirm]
                                     Successor

                     tick          next           start_n
                                          tick                           select                               select          confirm

          • Rapid model-based Design and Comparison
            of three variants
       4. November 2011                                          The Augmented “Drag-and-Drop                                    5
How to model?


• Models
    – Interactors (Abstract & Concrete Media, Mode)
          • Static: class diagram, Behavior: state-chart
    – Mappings Mode-To-Media Synchronization
          • Custom Notation

 4. November 2011                                          6
Abstract Media Model




4. November 2011            7
Abstract Media Model

Single Choice

Aggregates a set of
Entities from that only
one can be chosen at
a time

 Examples: Direction (left or right), Shopping Cart
  Further Properties:
    Container -> Aggregation, Discrete, Output to the User
     Contains Single Choice Elements that are Inputs
 4. November 2011                                            8
Abstract Behavior Model
         AUI:AIO:AIChoiceElement:
         AISingleChoiceElement

                             Presenting

                                      drop             listed
           initialized                                             next||prev||parent
                                                   focus
                                dragging                  defocus /aio=find(act);
           organize                                               aio.focus
                                          drag        focused
          organized

                   present    Selection
                                                                       H
          organize                    unchosen
                                                     [in(focused)] choose
              suspend          unchoose              / aios=find(parent.childs.chosen);
                                                                aios.all.unchoose
                                          chosen
          suspended



4. November 2011                                                                          9
Mode Model
            (Example: Gesture Interactor)
IR:IN:HandGesture:FlexibleTicker


                                                   NoHands
                   right_hand_appeared                      right_hand_disappeared
                                                                                 Right Hand

                                                                        Navigation
           Speed                                                                                    Predecessor                                       Command
                                started              [1s]/tick
                                                      [t]/tick
                         entry/start_ticker
                                                                                     tick                                        previous         wait_one
                          exit/stop_ticker                                                         previous            start_p
                                                                                                                tick
                                                                                                                                             select          confirmed
                                                                                            next
                                  SpeedAdjustment                                                             previous
                       closer               closer                                                                                next            selected     confirm
        normal                     faster                        fastest
           entry/                     entry/                        entry/                           Successor
       t = 1200ms;     farer      t = 1000ms;       farer        t = 800ms;
      restart_ticker              restart_ticker               restart_ticker        tick          next           start_n                select
                                                                                                          tick




    4. November 2011                                                                                                                                              10
Multimodal Mapping
(Combining Mode with concrete Media)




4. November 2011                   11
Conclusions & Future Work


               What’s the advantage?
• Detailed Modeling of
  Multimodal
  Interactions
  including behavior
• Existing tools
• No gap between
  design- and runtime
 4. November 2011                      12
Whats next?



Focus on:                                        Visit our website
      –   Fusion                                        – All papers
      –   Paradigm Design                               – Videos
      –   Formalization                                 – Open Source
      –   Tools                                           Software
      –   MINT Framework                                – MINT Framework


                    http://www.multi-access.de


 4. November 2011           Design of Multimodal Interaction               13
4. November 2011   14

Weitere ähnliche Inhalte

Kürzlich hochgeladen

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Victor Rentea
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 

Kürzlich hochgeladen (20)

Vector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptxVector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptx
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontology
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot ModelMcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 

Empfohlen

How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthHow Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
ThinkNow
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
Kurio // The Social Media Age(ncy)
 

Empfohlen (20)

2024 State of Marketing Report – by Hubspot
2024 State of Marketing Report – by Hubspot2024 State of Marketing Report – by Hubspot
2024 State of Marketing Report – by Hubspot
 
Everything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPTEverything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPT
 
Product Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage EngineeringsProduct Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage Engineerings
 
How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthHow Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
 
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdfAI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
 
Skeleton Culture Code
Skeleton Culture CodeSkeleton Culture Code
Skeleton Culture Code
 
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
 
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
 
How to have difficult conversations
How to have difficult conversations How to have difficult conversations
How to have difficult conversations
 
Introduction to Data Science
Introduction to Data ScienceIntroduction to Data Science
Introduction to Data Science
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best Practices
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project management
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
 

Model-based Design and Generation of a Gesture-based User Interface Navigation Control

  • 1. Model-based Design and Generation of a Gesture-based User Interface Navigation Control Sebastian Feuerstack, Mauro dos Santos Anjo, and Ednaldo Pizzolato Dr.-Ing. Sebastian Feuerstack Universidade Federal de São Carlos Departamento de Computacão 4. November 2011 Sebastian Feuerstack I Sebastian@Feuerstack.org
  • 2. Basic Question How to model and run multimodal interaction prototype variants ? 4. November 2011 2
  • 3. Why modeling? • One (visual) language that – is declarative and precise to discuss & execute – Is located between a tool and source code – Supports different forms of interaction and flexible prototyping of multimodal interfaces 4. November 2011 3
  • 4. What is state of the art ? 1. Task AUI CUI FUI CUI FUI 2. Widget W1 W2 Alg. A1 D1 Driver 4. November 2011 4
  • 5. Use Case: Test and Evaluation Gesture-based Interface Navigation :IN:hand_gestures NoHands [one_hand] [no_hands] OneHand Navigation previous / next / Predecessor Command closer / farer closer /farer Ticker tick previous wait_one start_p started tick previous select confirmed next [1s]/tick previous next selected [confirm] Successor tick next start_n tick select select confirm • Rapid model-based Design and Comparison of three variants 4. November 2011 The Augmented “Drag-and-Drop 5
  • 6. How to model? • Models – Interactors (Abstract & Concrete Media, Mode) • Static: class diagram, Behavior: state-chart – Mappings Mode-To-Media Synchronization • Custom Notation 4. November 2011 6
  • 7. Abstract Media Model 4. November 2011 7
  • 8. Abstract Media Model Single Choice Aggregates a set of Entities from that only one can be chosen at a time Examples: Direction (left or right), Shopping Cart Further Properties: Container -> Aggregation, Discrete, Output to the User Contains Single Choice Elements that are Inputs 4. November 2011 8
  • 9. Abstract Behavior Model AUI:AIO:AIChoiceElement: AISingleChoiceElement Presenting drop listed initialized next||prev||parent focus dragging defocus /aio=find(act); organize aio.focus drag focused organized present Selection H organize unchosen [in(focused)] choose suspend unchoose / aios=find(parent.childs.chosen); aios.all.unchoose chosen suspended 4. November 2011 9
  • 10. Mode Model (Example: Gesture Interactor) IR:IN:HandGesture:FlexibleTicker NoHands right_hand_appeared right_hand_disappeared Right Hand Navigation Speed Predecessor Command started [1s]/tick [t]/tick entry/start_ticker tick previous wait_one exit/stop_ticker previous start_p tick select confirmed next SpeedAdjustment previous closer closer next selected confirm normal faster fastest entry/ entry/ entry/ Successor t = 1200ms; farer t = 1000ms; farer t = 800ms; restart_ticker restart_ticker restart_ticker tick next start_n select tick 4. November 2011 10
  • 11. Multimodal Mapping (Combining Mode with concrete Media) 4. November 2011 11
  • 12. Conclusions & Future Work What’s the advantage? • Detailed Modeling of Multimodal Interactions including behavior • Existing tools • No gap between design- and runtime 4. November 2011 12
  • 13. Whats next? Focus on: Visit our website – Fusion – All papers – Paradigm Design – Videos – Formalization – Open Source – Tools Software – MINT Framework – MINT Framework http://www.multi-access.de 4. November 2011 Design of Multimodal Interaction 13

Hinweis der Redaktion

  1. Transformationalapproach Not targetedtomultmodalinterfaces, Models areinspectable but transformationsarecomplexAssembly Approach: Black-boxedcomponents, extensibilityproblem