SwingStates: Adding State Machines to the Swing Toolkit http://www.idiap.ch/uist2006/ SwingStates: Adding State Machines to the Swing Toolkit en Tue, 17 Oct 2006 00:00:00 +0200 no SwingStates Adding State Machines to the Swing Toolkit Caroline Appert Michel Beaudouin-Lafon LRI INRIA Futurs Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 SwingStates Adding State Machines to the Swing Toolkit Caroline Appert Michel Beaudouin-Lafon LRI INRIA Futurs SwingStates Adding State Machines to the Swing Toolkit Caroline Appert Michel Beaudouin-Lafon LRI INRIA Futurs 00:00:25 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs Why designing toolkits Toolkits are the tools of GUI developers. Current production toolkits are limited to the composition of standard widgets. Current GUIs do not take advantage of novel interactions techniques, because they are not supported by production toolkits. Implementing state-of-the-art interaction techniques requires powerful toolkits. Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 Why designing toolkits Toolkits are the tools of GUI developers. Current production toolkits are limited to the composition of standard widgets. Current GUIs do not take advantage of novel interactions techniques, because they are not supported by production toolkits. Implementing state-of-the-art interaction techniques requires powerful toolkits. Why designing toolkits Toolkits are the tools of GUI developers. Current production toolkits are limited to the composition of standard widgets. Current GUIs do not take advantage of novel interactions techniques, because they are not supported by production toolkits. Implementing state-of-the-art interaction techniques requires powerful toolkits. 00:01:00 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs Why SwingStates Some research toolkits support advanced interaction. e.g. subArctic Hudson et al. 2005, Gamet Myers et al. 1990, Amulet Myers et al. 1997 However, most developers stick to their usual toolkits. SwingStates extends the widely used Java Swing toolkit and Java2D library. Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 Why SwingStates Some research toolkits support advanced interaction. e.g. subArctic Hudson et al. 2005, Gamet Myers et al. 1990, Amulet Myers et al. 1997 However, most developers stick to their usual toolkits. SwingStates extends the widely used Java Swing toolkit and Java2D library. Why SwingStates Some research toolkits support advanced interaction. e.g. subArctic Hudson et al. 2005, Gamet Myers et al. 1990, Amulet Myers et al. 1997 However, most developers stick to their usual toolkits. SwingStates extends the widely used Java Swing toolkit and Java2D library. 00:00:28 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs A SwingStates sample IJIST number input 90 lines Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 A SwingStates sample IJIST number input 90 lines A SwingStates sample IJIST number input 90 lines 00:00:23 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs A SwingStates sample UIST number input 90 lines Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 A SwingStates sample UIST number input 90 lines A SwingStates sample UIST number input 90 lines 00:00:05 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs A SwingStates sample UIST number input 90 lines Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 A SwingStates sample UIST number input 90 lines A SwingStates sample UIST number input 90 lines 00:00:14 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs Programming interaction using state machines IP I IP QD new JStateli4achineO pubtic State up Transition press new PressBUTTON1, W public State Transition enter Q new EnterOnTog Transition retease new ReteaseBUTTON1, up pubtic State w- new StateO Transition leave new LTag Transltlon release new ReleaseCBUTTON1, lib Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 Programming interaction using state machines IP I IP QD new JStateli4achineO pubtic State up Transition press new PressBUTTON1, W public State Transition enter Q new EnterOnTog Transition retease new ReteaseBUTTON1, up pubtic State w- new StateO Transition leave new LTag Transltlon release new ReleaseCBUTTON1, lib Programming interaction using state machines IP I IP QD new JStateli4achineO pubtic State up Transition press new PressBUTTON1, W public State Transition enter Q new EnterOnTog Transition retease new ReteaseBUTTON1, up pubtic State w- new StateO Transition leave new LTag Transltlon release new ReleaseCBUTTON1, lib 00:00:49 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs State machine syntax using inner classes JStatechine m new JStateNachine machine public State instate new StateO Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 State machine syntax using inner classes JStatechine m new JStateNachine machine public State instate new StateO State machine syntax using inner classes JStatechine m new JStateNachine machine public State instate new StateO 00:00:15 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs State machine syntax using inner classes 3Statelchine m new StateMachine machine public State inState D, DID DI, Transition leave LRL Ah D ILJ Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 State machine syntax using inner classes 3Statelchine m new StateMachine machine public State inState D, DID DI, Transition leave LRL Ah D ILJ State machine syntax using inner classes 3Statelchine m new StateMachine machine public State inState D, DID DI, Transition leave LRL Ah D ILJ 00:00:38 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs A powerful Canvas widget Set of Java2D shapes Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 A powerful Canvas widget Set of Java2D shapes A powerful Canvas widget Set of Java2D shapes 00:00:29 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs A powerful Canvas widget Set of Java2D shapes Relations between shapes display order, hierarchy, clipping Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 A powerful Canvas widget Set of Java2D shapes Relations between shapes display order, hierarchy, clipping A powerful Canvas widget Set of Java2D shapes Relations between shapes display order, hierarchy, clipping 00:00:11 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs A powerful Canvas widget Set of Java2D shapes Relations between shapes display order, hierarchy, clipping Contextual events in state machines Transition select ne PressOnStmpeBUTTON1 Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 A powerful Canvas widget Set of Java2D shapes Relations between shapes display order, hierarchy, clipping Contextual events in state machines Transition select ne PressOnStmpeBUTTON1 A powerful Canvas widget Set of Java2D shapes Relations between shapes display order, hierarchy, clipping Contextual events in state machines Transition select ne PressOnStmpeBUTTON1 00:00:19 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs Tagging Grouping Active tags Intentional tags Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 Tagging Grouping Active tags Intentional tags Tagging Grouping Active tags Intentional tags 00:00:15 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs Tagging Grouping public void sho4enuPointZD pt canvas, getTagmenultem, transtateToCpt, getX, pt. getYC setDrawabtetrue, setPickabtetrue pubtic void hideNenu canvas, getTag menultem, setDrawabtefatse, setPickabtefatse Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 Tagging Grouping public void sho4enuPointZD pt canvas, getTagmenultem, transtateToCpt, getX, pt. getYC setDrawabtetrue, setPickabtetrue pubtic void hideNenu canvas, getTag menultem, setDrawabtefatse, setPickabtefatse Tagging Grouping public void sho4enuPointZD pt canvas, getTagmenultem, transtateToCpt, getX, pt. getYC setDrawabtetrue, setPickabtetrue pubtic void hideNenu canvas, getTag menultem, setDrawabtefatse, setPickabtefatse 00:00:27 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs Tagging Active tags tag behavior crass TextFietdTag extends JExtensionatTag public void addedJComponent c c. setBackgroundCotor. YELLOW public void removedCJComponent c c. setBackgroundCotor. WHITE TextFieldT tfTa tfTag, addTotextFl eId tfTag, removeF tomtext FIet instructions used in state machine Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 Tagging Active tags tag behavior crass TextFietdTag extends JExtensionatTag public void addedJComponent c c. setBackgroundCotor. YELLOW public void removedCJComponent c c. setBackgroundCotor. WHITE TextFieldT tfTa tfTag, addTotextFl eId tfTag, removeF tomtext FIet instructions used in state machine Tagging Active tags tag behavior crass TextFietdTag extends JExtensionatTag public void addedJComponent c c. setBackgroundCotor. YELLOW public void removedCJComponent c c. setBackgroundCotor. WHITE TextFieldT tfTa tfTag, addTotextFl eId tfTag, removeF tomtext FIet instructions used in state machine 00:00:33 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs Tagging Intentional ta S Predicate crass UpperTag extends ClntentionatTag pubtic bootean criterionCShape s The set of tagged objects is dynamical, computed at each use new UpperTagO UpperTag upTag upTag.transtateByO, 50 upTag, setFitIPaintCotor. LIGHT GRAY Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 Tagging Intentional ta S Predicate crass UpperTag extends ClntentionatTag pubtic bootean criterionCShape s The set of tagged objects is dynamical, computed at each use new UpperTagO UpperTag upTag upTag.transtateByO, 50 upTag, setFitIPaintCotor. LIGHT GRAY Tagging Intentional ta S Predicate crass UpperTag extends ClntentionatTag pubtic bootean criterionCShape s The set of tagged objects is dynamical, computed at each use new UpperTagO UpperTag upTag upTag.transtateByO, 50 upTag, setFitIPaintCotor. LIGHT GRAY 00:00:26 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs Communication between state machines pressselect desetected selected canceldeseect presslshowMenu releaseOnMenultem processEventnew ColorEventblue Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 Communication between state machines pressselect desetected selected canceldeseect presslshowMenu releaseOnMenultem processEventnew ColorEventblue Communication between state machines pressselect desetected selected canceldeseect presslshowMenu releaseOnMenultem processEventnew ColorEventblue 00:01:04 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs SwingStates design principles Reification Graphical elements are objects shapes unlike Java2D and tags Interaction is extemalized as a state machine object Polymorphism Same Operations on a shape, a tag or a canvas a widget or a tag Chained syntax canvas, newEllipse10,10,20,30, rotateToMath. PI4 setFittPaintCotor, red. setOuttinedfatse, addTag selected Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 SwingStates design principles Reification Graphical elements are objects shapes unlike Java2D and tags Interaction is extemalized as a state machine object Polymorphism Same Operations on a shape, a tag or a canvas a widget or a tag Chained syntax canvas, newEllipse10,10,20,30, rotateToMath. PI4 setFittPaintCotor, red. setOuttinedfatse, addTag selected SwingStates design principles Reification Graphical elements are objects shapes unlike Java2D and tags Interaction is extemalized as a state machine object Polymorphism Same Operations on a shape, a tag or a canvas a widget or a tag Chained syntax canvas, newEllipse10,10,20,30, rotateToMath. PI4 setFittPaintCotor, red. setOuttinedfatse, addTag selected 00:00:58 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs Is SwingStates usable 14 groups of 2nd year Master students 1 or 2 students per group Duration 2 months Benchmark of 8 interaction techniques Side Views w.BW P Local fools Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 Is SwingStates usable 14 groups of 2nd year Master students 1 or 2 students per group Duration 2 months Benchmark of 8 interaction techniques Side Views w.BW P Local fools Is SwingStates usable 14 groups of 2nd year Master students 1 or 2 students per group Duration 2 months Benchmark of 8 interaction techniques Side Views w.BW P Local fools 00:00:34 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs Is SwingStates usable Q All prototypes were functional 750 lines of code 250 lines per machine on average 2 to 9 states per machine 8 to 32 transitions per state Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 Is SwingStates usable Q All prototypes were functional 750 lines of code 250 lines per machine on average 2 to 9 states per machine 8 to 32 transitions per state Is SwingStates usable Q All prototypes were functional 750 lines of code 250 lines per machine on average 2 to 9 states per machine 8 to 32 transitions per state 00:00:36 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs Conclusion and Perspectives SwingStates is a novel way to use state machines to program advanced interaction techniques with the popular Java Swing toolkit and Java2D library. Available at http ins itu. iri. frSwingStates Future work Handle non-standard input devices D Gain more experience with real users Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 Conclusion and Perspectives SwingStates is a novel way to use state machines to program advanced interaction techniques with the popular Java Swing toolkit and Java2D library. Available at http ins itu. iri. frSwingStates Future work Handle non-standard input devices D Gain more experience with real users Conclusion and Perspectives SwingStates is a novel way to use state machines to program advanced interaction techniques with the popular Java Swing toolkit and Java2D library. Available at http ins itu. iri. frSwingStates Future work Handle non-standard input devices D Gain more experience with real users 00:00:38 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs Wed, 18 Oct 2006 00:00:00 +0200 SwingStates: Adding State Machines to the Swing Toolkit SCIENCE > 2006 00:01:49 no Caroline Appert, Michel Beaudouin-Lafon, LRI Paris and INRIA Futurs