more generic analysis regarding fundamentals of *interaction control*
This commit is contained in:
parent
4d8579e0ee
commit
e40c14606e
2 changed files with 96 additions and 9 deletions
|
|
@ -1539,9 +1539,9 @@ To support this handling scheme, some infrastructure is in place:
|
|||
* performing the actual execution is delegated to a handling pattern object, accessed by name.
|
||||
</pre>
|
||||
</div>
|
||||
<div title="CommandInvocationAnalysis" creator="Ichthyostega" modifier="Ichthyostega" created="201702142329" modified="201702160131" tags="draft impl GuiPattern example discuss" changecount="10">
|
||||
<div title="CommandInvocationAnalysis" creator="Ichthyostega" modifier="Ichthyostega" created="201702142329" modified="201702160147" tags="draft impl GuiPattern example discuss" changecount="12">
|
||||
<pre>//This page is a scrapbook to collect observations about command invocation in the UI//
|
||||
{{red{2/2017}}} the goal is to shape some generic patterns of InteractionControl
|
||||
{{red{2/2017}}} the goal is to shape some generic patterns of InteractionControl (&rarr; GuiCommandBinding)
|
||||
|
||||
!Add Sequence
|
||||
The intention is to add a new sequence //to the current session.//
|
||||
|
|
@ -1567,6 +1567,9 @@ Now, while all of this means a lot of functionality and complexity down in Proc,
|
|||
Here the intention is to add a new scope //close to where we "are" currently.//
|
||||
If the currently active element is something within a scope, we want the new scope as a sibling, otherwise we want it as a child, but close at hand.
|
||||
So, for the purpose of this analysis, the "add Track" action serves as an example where we need to pick up the subject of the change from context...
|
||||
* the fact there is always a timeline and a sequence, also implies there is always a fork root (track)
|
||||
* so this operation basically adds to a //"current scope"// -- or next to it, as sibling
|
||||
* this means, the UI logic has to provide a //current model element,// while the details of actually selecting a parent are decided elsewhere (in Proc-Layer, in rules)
|
||||
</pre>
|
||||
</div>
|
||||
<div title="CommandLifecycle" modifier="Ichthyostega" created="200907210135" modified="201601162035" tags="SessionLogic spec draft design img" changecount="1">
|
||||
|
|
@ -3242,7 +3245,7 @@ The InstanceHandle is created by the service implementation and will automatical
|
|||
&rarr; see [[detailed description here|LayerSeparationInterfaces]]
|
||||
</pre>
|
||||
</div>
|
||||
<div title="InteractionControl" creator="Ichthyostega" modifier="Ichthyostega" created="201511272315" modified="201702142312" tags="design decision Concepts GuiPattern draft discuss" changecount="12">
|
||||
<div title="InteractionControl" creator="Ichthyostega" modifier="Ichthyostega" created="201511272315" modified="201702160256" tags="design decision Concepts GuiPattern draft discuss" changecount="13">
|
||||
<pre>This overarching topic is where the arrangement of our interface components meets considerations about interaction design.
|
||||
The interface programming allows us to react on events and trigger behaviour, and it allows us to arrange building blocks within a layout framework. Beyond that, there needs to be some kind of coherency in the way matters are arranged -- this is the realm of conventions and guidelines. Yet in any more than trivial UI application, there is an intermediate and implicit level of understanding, where things just happen, which can not fully be derived from first principles. It is fine to have a convention to put the "OK" button right -- but how to we get at trimming a clip? How do we how we are to get at trimming a clip? if we work with the mouse? or the keyboard? or with a pen? or with a hardware controller we don't even know yet? We could deal with such on a case-by-case base (as the so called reasonable people do) or we could aim at an abstract intermediary space, with the ability to assimilate the practical situation yet to come.
|
||||
|
||||
|
|
@ -3251,16 +3254,41 @@ The interface programming allows us to react on events and trigger behaviour, an
|
|||
;locality of work spaces
|
||||
:but the arrangement of the interface interactions is not amorphous, rather it is segregated into cohesive clusters of closely interrelated actions. We move between these clusters of activity the same way as we move between several well confined rooms within a building.
|
||||
;context and focus of activity
|
||||
:most of what we could do //in therory,// is not relevant most of the time. But when the inner logic of what we're about to do coincides with the things at hand, then we feel enabled.
|
||||
:most of what we could do //in theory,// is not relevant most of the time. But when the inner logic of what we're about to do coincides with the things at hand, then we feel enabled.
|
||||
;shift of perspective
|
||||
:and while we work, the focus moves along. Some things are closer, other things are remote and require us to move and re-orient and reshape our perspective, should we choose to turn towards them.
|
||||
;the ability to arrange what is relevant
|
||||
:we do the same stuff again and again, and this makes us observe and gradually understand matters. As we reveal the inner nature of what we're doing, we desire to arrange close at hand what belongs together, and to expunge the superficial and distracting.
|
||||
|
||||
&rarr; detailed [[analysis how commands are to be invoked|CommandInvocationAnalysis]]
|
||||
|
||||
!Foundation Concepts
|
||||
The primary insight is, that we build upon a spatial metaphor -- and thus we start out with defining various kinds of //locations.// We express interactions as //happening somewhere...//
|
||||
;work site
|
||||
:a distinct, coherent place where some ongoing work is done
|
||||
:the work site might move along with the work, but we also may leave it temporarily to visit some other work site
|
||||
;the spot
|
||||
:this is where we currently are -- taken both in the sense of a location and a spotlight
|
||||
:thus a spot is always at some work site, but it can be navigated to another one
|
||||
;focus
|
||||
:the concrete realisation of the spot within a given control system
|
||||
;control system
|
||||
:a practical technical realisation of an human-computer-interface, like keyboard input/navigation, mouse, pen, hardware controller, touch
|
||||
;UI frame
|
||||
:the overall interface is arranged into independent top-level segments of equal importance.
|
||||
:practically speaking, we may have multiple top-level windows residing on multiple desktops...
|
||||
;perspective
|
||||
:a set of concrete configuration parameters defining the contents of one UI frame
|
||||
:the perspective defines which views are opened and arranged at what position and within which docking panel
|
||||
;focus path
|
||||
:concrete coordinates to reach a specific work site
|
||||
:the focus path specifies the UI frame (top-level window), the perspective, and then some canonical path to navigate down a hierarchy to reach the anchor point of the work site
|
||||
;the spot locator
|
||||
:this is what can be navigated, in order to move the sport from work site to work site
|
||||
:the spot locator is relocated by loading a new focus path to another work site
|
||||
</pre>
|
||||
</div>
|
||||
<div title="InteractionDirector" creator="Ichthyostega" modifier="Ichthyostega" created="201702102146" modified="201702160131" tags="def draft" changecount="3">
|
||||
<div title="InteractionDirector" creator="Ichthyostega" modifier="Ichthyostega" created="201702102146" modified="201702160144" tags="def draft" changecount="6">
|
||||
<pre>//the top-level controller within the UI.//
|
||||
In Lumiera, the structures of the model within the [[Session]] (the so called HighLevelModel) are mapped onto corresponding [[tangible UI entities|UI-Element]], which serve as a front-end to represent those entities towards the user. Within the model, there is a //conceptual root node// -- which logically corresponds to the session itself. This [[root element in model|ModelRootMO]] links together the actual top-level entities, which are the (multiple) timelines, with the asset management and defaults and rules configuration within the session.
|
||||
|
||||
|
|
@ -3268,6 +3296,7 @@ And the counterpart of this root element within the UI is the {{{InteractionDire
|
|||
|
||||
Why do we need a connection joint between those parts?
|
||||
Because issuing any actions on the model within the session -- i.e. any editing operation -- is like forming a sentence: we need to spell out //what we want to do// and we need to spell out the subject and the object of our activity. And any one of these can, and will in fact, be sometimes derived //from the context of the interaction.// Because, given the right context, it is almost clear what you want to do -- you just need to fill in that tiny little bit of information to actually make it happen. In Lumiera we want to build a good UI, which is an UI well suited to this very human way of interacting with one's environment within a given context.
|
||||
> to understand this, it is best &rarr; to [[look at some examples|CommandInvocationAnalysis]]
|
||||
</pre>
|
||||
</div>
|
||||
<div title="InteractionStateManager" creator="Ichthyostega" modifier="Ichthyostega" created="201511280402" modified="201702142312" tags="def design GuiIntegration draft" changecount="6">
|
||||
|
|
|
|||
|
|
@ -7,6 +7,20 @@
|
|||
<node CREATED="1434128054470" HGAP="7" ID="ID_1166611516" MODIFIED="1476376907132" TEXT="Workflow" VSHIFT="-15">
|
||||
<node CREATED="1455289597596" ID="ID_970065036" MODIFIED="1455289601196" TEXT="work site"/>
|
||||
<node CREATED="1455289466261" ID="ID_273679080" MODIFIED="1455289469961" TEXT="PresentationState"/>
|
||||
<node CREATED="1487210691163" ID="ID_1259700796" MODIFIED="1487210944526" TEXT="konzeptioneller Rahmen">
|
||||
<linktarget COLOR="#1adbac" DESTINATION="ID_1259700796" ENDARROW="Default" ENDINCLINATION="450;232;" ID="Arrow_ID_114106295" SOURCE="ID_1430752735" STARTARROW="Default" STARTINCLINATION="-1346;-1090;"/>
|
||||
<font ITALIC="true" NAME="SansSerif" SIZE="14"/>
|
||||
<node CREATED="1487210978300" ID="ID_1502972928" MODIFIED="1487210984415" TEXT="Spot == wo wir sind"/>
|
||||
<node CREATED="1487211011447" ID="ID_61564732" MODIFIED="1487211040824" TEXT="Work Site == wo wir sein können"/>
|
||||
<node CREATED="1487211200966" ID="ID_1565474518" MODIFIED="1487211238989" TEXT="Focus == Realisierung des Spot in einem ControlSystem"/>
|
||||
<node CREATED="1487211243656" ID="ID_953924547" MODIFIED="1487211262209" TEXT="ControlSystem == Steuerungs-Paradigma">
|
||||
<node CREATED="1487211263461" ID="ID_374086294" MODIFIED="1487211315754" TEXT="Maus / current element"/>
|
||||
<node CREATED="1487211266901" ID="ID_306043379" MODIFIED="1487211279343" TEXT="Keyboard / Input Focus"/>
|
||||
</node>
|
||||
<node CREATED="1487211777687" ID="ID_577769257" MODIFIED="1487211824509" TEXT="Focus Path == kanonische Koordinaten innerhalb von einem UI Frame"/>
|
||||
<node CREATED="1487211825857" ID="ID_883246945" MODIFIED="1487211951739" TEXT="UI Frame == top-level-Segment (konkret: WorkspaceWindow)"/>
|
||||
<node CREATED="1487212066024" ID="ID_378199749" MODIFIED="1487212081762" TEXT="Spot Locator == das was navigiert wird, wenn sich der Spot bewegt"/>
|
||||
</node>
|
||||
</node>
|
||||
<node CREATED="1477784761581" HGAP="72" ID="ID_854334914" MODIFIED="1477784783508" TEXT="Rahmen" VSHIFT="-21">
|
||||
<node CREATED="1481320580216" ID="ID_1418071897" MODIFIED="1481320587160" TEXT="vorantreiben">
|
||||
|
|
@ -2064,8 +2078,9 @@
|
|||
<node CREATED="1485454263876" ID="ID_543704434" MODIFIED="1485454270615" TEXT="globale Keybindings"/>
|
||||
</node>
|
||||
</node>
|
||||
<node BACKGROUND_COLOR="#eee5c3" COLOR="#990000" CREATED="1486763185746" HGAP="33" ID="ID_362749694" MODIFIED="1486768064438" TEXT="workspace::InteractionDirector" VSHIFT="21">
|
||||
<node BACKGROUND_COLOR="#eee5c3" COLOR="#990000" CREATED="1486763185746" HGAP="33" ID="ID_362749694" MODIFIED="1487213949367" TEXT="workspace::InteractionDirector" VSHIFT="21">
|
||||
<linktarget COLOR="#683c5b" DESTINATION="ID_362749694" ENDARROW="Default" ENDINCLINATION="-394;0;" ID="Arrow_ID_1979576517" SOURCE="ID_113005643" STARTARROW="None" STARTINCLINATION="-24;-159;"/>
|
||||
<linktarget COLOR="#1b3863" DESTINATION="ID_362749694" ENDARROW="Default" ENDINCLINATION="-26;1602;" ID="Arrow_ID_959577029" SOURCE="ID_735655054" STARTARROW="Default" STARTINCLINATION="-376;-568;"/>
|
||||
<icon BUILTIN="pencil"/>
|
||||
<node CREATED="1486763268223" ID="ID_199328732" MODIFIED="1486763277392" TEXT="nicht der Meister">
|
||||
<font ITALIC="true" NAME="SansSerif" SIZE="12"/>
|
||||
|
|
@ -2090,8 +2105,42 @@
|
|||
<node BACKGROUND_COLOR="#fdfdcf" COLOR="#ff0000" CREATED="1487119208622" ID="ID_728171298" MODIFIED="1487119223847" TEXT="Analyse anhand einiger Beispiele">
|
||||
<icon BUILTIN="pencil"/>
|
||||
</node>
|
||||
<node CREATED="1487119230659" ID="ID_651577067" MODIFIED="1487119250636" TEXT="Frage: wieviel Interaction Control müssen wir sofrt jetzt implementieren">
|
||||
<node CREATED="1487119230659" ID="ID_651577067" MODIFIED="1487213974948">
|
||||
<richcontent TYPE="NODE"><html>
|
||||
<head>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
Frage: wieviel Interaction Control
|
||||
</p>
|
||||
<p>
|
||||
müssen wir sofort jetzt implementieren
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
</richcontent>
|
||||
<icon BUILTIN="help"/>
|
||||
<node BACKGROUND_COLOR="#eee5c3" COLOR="#990000" CREATED="1487208182655" ID="ID_1220225827" MODIFIED="1487214021907">
|
||||
<richcontent TYPE="NODE"><html>
|
||||
<head>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
brauche ein <i>aktuelles</i> Modell-Element
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
</richcontent>
|
||||
<icon BUILTIN="flag-yellow"/>
|
||||
</node>
|
||||
<node BACKGROUND_COLOR="#eee5c3" COLOR="#990000" CREATED="1487208211131" ID="ID_31351462" MODIFIED="1487214024007" TEXT="...und ein Konzept, wie man das gewinnen kann">
|
||||
<icon BUILTIN="flag-yellow"/>
|
||||
</node>
|
||||
<node BACKGROUND_COLOR="#eee5c3" COLOR="#990000" CREATED="1487208260557" ID="ID_1057793058" MODIFIED="1487214025311" TEXT="und wer dafür zuständig sein wird">
|
||||
<icon BUILTIN="flag-yellow"/>
|
||||
</node>
|
||||
</node>
|
||||
</node>
|
||||
</node>
|
||||
|
|
@ -9512,7 +9561,7 @@
|
|||
</node>
|
||||
</node>
|
||||
</node>
|
||||
<node CREATED="1448658726090" FOLDED="true" HGAP="18" ID="ID_37610818" MODIFIED="1483927583127" TEXT="Commands" VSHIFT="36">
|
||||
<node CREATED="1448658726090" FOLDED="true" HGAP="18" ID="ID_37610818" MODIFIED="1487210546451" TEXT="Commands" VSHIFT="36">
|
||||
<node CREATED="1448658755071" ID="ID_1033500384" MODIFIED="1448658767933" TEXT="wie definieren">
|
||||
<icon BUILTIN="help"/>
|
||||
<node CREATED="1448658974985" ID="ID_974207484" MODIFIED="1448658989011" TEXT="Definition braucht Session-Modell"/>
|
||||
|
|
@ -9775,7 +9824,7 @@
|
|||
<arrowlink COLOR="#b694bf" DESTINATION="ID_430949603" ENDARROW="Default" ENDINCLINATION="178;425;" ID="Arrow_ID_1062305149" STARTARROW="Default" STARTINCLINATION="-629;-2354;"/>
|
||||
<linktarget COLOR="#5f0ac8" DESTINATION="ID_329609486" ENDARROW="Default" ENDINCLINATION="219;-148;" ID="Arrow_ID_1101633958" SOURCE="ID_1009169288" STARTARROW="None" STARTINCLINATION="-315;0;"/>
|
||||
<font NAME="SansSerif" SIZE="15"/>
|
||||
<node CREATED="1448669439582" FOLDED="true" HGAP="41" ID="ID_307071507" MODIFIED="1483910919618" TEXT="ad-hoc oder systematisch" VSHIFT="-2">
|
||||
<node CREATED="1448669439582" FOLDED="true" HGAP="41" ID="ID_307071507" MODIFIED="1487210388917" TEXT="ad-hoc oder systematisch" VSHIFT="-2">
|
||||
<icon BUILTIN="help"/>
|
||||
<node CREATED="1448669512988" ID="ID_1184892495" MODIFIED="1448669517328" TEXT="fundamentale Frage"/>
|
||||
<node CREATED="1448669517796" ID="ID_1165902172" MODIFIED="1448669526326" TEXT="für mich eigentlich sofort klar"/>
|
||||
|
|
@ -9810,6 +9859,15 @@
|
|||
<node CREATED="1448669899113" ID="ID_990871123" MODIFIED="1450228230836" TEXT="er sendet jeweils einen CommandInvocationTrail"/>
|
||||
</node>
|
||||
</node>
|
||||
<node CREATED="1487213803525" ID="ID_735655054" MODIFIED="1487213920034" TEXT="InteractionDirector">
|
||||
<arrowlink COLOR="#1b3863" DESTINATION="ID_362749694" ENDARROW="Default" ENDINCLINATION="-26;1602;" ID="Arrow_ID_959577029" STARTARROW="Default" STARTINCLINATION="-376;-568;"/>
|
||||
</node>
|
||||
<node CREATED="1487210642170" ID="ID_337241818" MODIFIED="1487210647405" TEXT="Rahmen global">
|
||||
<node CREATED="1487210648449" ID="ID_1430752735" MODIFIED="1487210944526" TEXT="konzeptionell">
|
||||
<arrowlink COLOR="#1adbac" DESTINATION="ID_1259700796" ENDARROW="Default" ENDINCLINATION="450;232;" ID="Arrow_ID_114106295" STARTARROW="Default" STARTINCLINATION="-1346;-1090;"/>
|
||||
<font ITALIC="true" NAME="SansSerif" SIZE="14"/>
|
||||
</node>
|
||||
</node>
|
||||
</node>
|
||||
<node CREATED="1448070547667" FOLDED="true" HGAP="16" ID="ID_669457401" MODIFIED="1455422001808" TEXT="Bus-Terminal" VSHIFT="6">
|
||||
<icon BUILTIN="prepare"/>
|
||||
|
|
|
|||
Loading…
Reference in a new issue