Date post: | 15-Jul-2015 |
Category: |
Technology |
Upload: | filip-kis |
View: | 47 times |
Download: | 4 times |
Declarative Prototyping with Data
Filip Kis
Media Technology and Interaction Design
KTH – Royal Institute of Technology
Stockholm, Sweden
Double degree
MSc in Computer Systems Engineering(2009)
MSc in Software Engineering(2010)
Started the PhD in 2011
Working in a team
Different level of
knowledge and expertise
High frequency of members
Not (too) technical
Sustainability?
<?php
$con = mysql_connect("localhost","peter","abc123");
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("my_db", $con);
$result = mysql_query("SELECT * FROM general_Employe_");
while($row = mysql_fetch_array($result))
{
echo $row['name'] . " " . $row['surname'];
echo "<br />";
}
mysql_close($con);
?>
<mak:list from="general.Employee e">
<mak:value expr="e.name"/>
<mak:value expr="e.surname"/>
<br/>
</mak:list>
Declarative?
UI modeling
Interaction prototypingLayout prototyping
UI template Query Annotation
Domain Model
Semantic Annotation
Example data
Graphic Transformations
Kis, F. and Bogdan, C. 2013. Proceedings of the 46th HICSS (IEEE Computer Society, Washington, DC, USA, 2013).
Lightweight Low-Level Query-Centric User Interface Modeling
Layout prototyping
Interaction Prototyping
Interpretation of modeled UI
MBUID: Model Based User Interface Development
Task Models
Cameleon Reference
Framework
Discourse Based Modeling
• Kis, F., Bogdan, C., Kaindl, H. and Falb, J. 2014. Towards Fully Declarative High-level Interaction Models: An Approach Facilitating Automated GUI Generation. Proceedings of the 47th HICSS (IEEE Computer Society, Washington, DC, USA, 2014)
• Kis. F. and Bogdan, C. Generating Modeler-Editable Interactive Prototypes from Query-Annotated Discourse Models (to be submitted)
50% PhD (year ago)
MBUID issues
Too much Software Engineering
Trying to generate everything
+ missing a context
Range Anxiety
UX trends (and tech challenges)
Responsivness
Real-time collaboration
Data from various sources
According to programmableweb.com
Tech trends
Web components
Declarative approaches
Reactive programming
JavaScript Libraries
<mak:list from="general.Employee e">
<mak:value expr="e.name"/>
<mak:value expr="e.surname"/>
<br/>
</mak:list>
Declarative!
<data from="geo.places gp1" where="gp1.text = query1">
<data from="geo.places gp2" where="gp2.text = query2">
<data from="weather.forecast wf1" where="wf1.woeid = gp1.place[0].woeid AND wf1.u = 'c'">
<data from="weather.forecast wf2" where="wf2.woeid = gp2.place[0].woeid AND wf2.u = 'c'">
{{query1}} high: {{wf1.channel.item.forecast[0].high}} <br>
{{query2}} high: {{wf2.channel.item.forecast[0].high}} <br>
The difference: {{wf1.channel.item.forecast[0].high -wf2.channel.item.forecast[0].high}}
</data>
</data>
<div ng-if="$pending">
Loading...
</div>
</data>
</data>
Remaining challenges
Understanding the data (APIs)
Learnability
Advanced interaction and new data
Evaluation in a context
Tech trends:Web components
Declarative approachesReactive programming
JavaScript Libraries
UX Trends:Responsivness Real-time collaborationData from various sources
Nomadic work
Fast and iterative processes
Bleeding edge tech
Strong community (meetups, incubators, etc.)
The context: Tech startups
Take away
Reflect on everything you do
Read & discuss other thesis
Do something you believe in