myers2012seif slides
TRANSCRIPT
-
8/12/2019 Myers2012SEIF Slides
1/50
-
8/12/2019 Myers2012SEIF Slides
2/50
Natural Programming Projec
Researching better tools for programmers si Natural Programming project started in 1995
Make programming easier and more correct more natural
Closer to the way that people think about algoritsolving their tasks (not Natural UIs)
Methodology human-centered approach
Perform studiesto inform design
Provide new knowledge about what people do and
Guide the designs from the data
-
8/12/2019 Myers2012SEIF Slides
3/50
End User Programming People whose primary job is notprogramming
In 2012, in USA at work: Scaffidi, Shaw and Myers 20
3 million professional programmers
6 million scientists & engineers
13 million will describe themselves as programmers
55 million will use spreadsheets or databases at work (may potentially program)
90 million computer users at work in US
We should make better tools for all of these peo
90,000,000
80,000,000100,000,000
-
8/12/2019 Myers2012SEIF Slides
4/50
Debugging
Study commissioned by NIST USA (214 software vendors
Software errors cost ~$60 billion annua
Software engineers spend 70-80% of tiand debugging
Time for 1 developer to fix 1 bug was ~
Current debugging techniques same l t 70
-
8/12/2019 Myers2012SEIF Slides
5/50
Goal: Gentle Slope Systems
Difficultyof
Use
Fla
ActionScript
C Programming
Vis
C or CSwing
JavaWeb D
CSS & HTML
JavaScript
Ser
-
8/12/2019 Myers2012SEIF Slides
6/50
Improve Developer Experien
Use human centered approaches Make developers more effective
Reduce errorsin resulting code
Insure that developer tools are use Understand developers barriers th
wasted time
Direct efforts at most importantiss
Address: programming languages
-
8/12/2019 Myers2012SEIF Slides
7/50
Why Would Being Natural be
Programmers are People Too Take the human into account
Language should be close to users plan
Programming is the process of transforming a mental pthat is compatible with the computer.
Jean-Michel Hoc
Closeness of mappingThe closer the programming world is to the problem w
easier the problem-solving ought to be. Conventional languages are a long way from that goal. Green an
Depends on target population
-
8/12/2019 Myers2012SEIF Slides
8/50
-
8/12/2019 Myers2012SEIF Slides
9/50
First Natural Programming S
John Pane, PhD 2002 Studies:
How people naturally express programconcepts and algorithms
1)Nine scenes from PacMan
2)Transforming and calculatingdata in a spreadsheet
Specific issue of language design3) S l ti ifi bj t f (
-
8/12/2019 Myers2012SEIF Slides
10/50
Examples of Results
Rule-based styleIf PacMan loses all his lives, its game over.
And, Or, Not dont match computerinterpretation
men andwomen, notan apple or pear
Operations suggest data as lists, not array
People dont make space before inserting
Objects normally movingIf PacMan hits a wall he stops
( )
-
8/12/2019 Myers2012SEIF Slides
11/50
New Language and System: H
John Pane, PhD 2002 Properties:
Metaphor of agent (Handythe dog) operating on cards
All operations can operateon single items or setsof items
Integrated queries with language
Sets can be dynamically constructed and used
http://handsvideo7.5min.mpg/ -
8/12/2019 Myers2012SEIF Slides
12/50
Supporting Natural Data Ty
Chris Scaffidi, PhD 2009
Ask users about types of data, say Person namedate, Project code,
User-centered type system called topes
Structured
Constraints on the values and parts
May be always or usually true
USA phone area code never ends in 11
USA Last names usually start with a capital letter
Library for verifying & transforming values Can be used from JavaScript
-
8/12/2019 Myers2012SEIF Slides
13/50
Study of Errors
Study of novice errors and debugginCreated a new model of barriers & kind
All of the observed debugging problem
addressed by Why questions 32% were Why did; 68% were Why did
Current debugging techniques requirguesswhere bug is or where to look
Most of initial guesses are wrong even
-
8/12/2019 Myers2012SEIF Slides
14/50
Whyline
Andy Ko, PhD 2008 Allow users to directly ask Why aWhy not
http://../ko-marmalade-whyline/whyline-java-new%20(1.5%20min).mov -
8/12/2019 Myers2012SEIF Slides
15/50
-
8/12/2019 Myers2012SEIF Slides
16/50
Crystal Crystal: Clarifications RegardingYour Software
using a Toolkit,Architecture and Language
Apply WhyLine idea to regular desktop application
Lots of complexity in powerful features that peopllike
Ask Why about whatrecently happened
Architecture: supportsadding to application
with small overhead
-
8/12/2019 Myers2012SEIF Slides
17/50
WebCrystal
Investigate CSS and
HTML responsible forexample behaviors
Navigate around HTMLhierarchy
Ask how-do-Iquestions about look,position and behavior
Generates code in user-selected
format
-
8/12/2019 Myers2012SEIF Slides
18/50
Study of Design Requirements forMaintenance-Oriented IDEs
Studied expertuse of Java Eclipse Ilab setting(2004-2006)
Focus on day-to-day maintenance t
such as bug repairs and featureenhancements
Lab study with detailed analysis
Rich dataset multiple papers
-
8/12/2019 Myers2012SEIF Slides
19/50
A Programmers Working
A collection oftask-relevantcode fragments
In modernsoftwaredevelopment,
dependenciesare distributed
-
8/12/2019 Myers2012SEIF Slides
20/50
Times for Bottlenecks
Each instance of an interactive bottlecost only a few seconds, but . . .
-
8/12/2019 Myers2012SEIF Slides
21/50
Jasper: Working Set Tool
Jasper= JavaAid with Sets of Pertinent Element
Recall
Allow programmers to grab arbitrary fragments orepresent working sets
Allow programmers to view in one place, one screen
-
8/12/2019 Myers2012SEIF Slides
22/50
Study of APIs
Started as PhD work of Jeff Stylos, 200Inspired by Steven Clarke, Microsoft Visua
group
Application Programming InterfaceLibraries, frameworks, SDKs,
Which programming patterns are most Barriers to use of APIs Measures: learnability, errors, preferen Expert and novice programmers
Studied: Default parameters in constructors
-
8/12/2019 Myers2012SEIF Slides
23/50
Factory Pattern
Instead of normal creation:Widget w = ne
Objects must be created by anotherclassAbstractFactory f = AbstractFactory.getDefaultWidget w = f.createWidget();
Used frequently in Java (>61) and .Net (>
SAP Results:
When asked to design on blank paper, no oa factory
Time to develop using factories took 2.1 to 5l d t l t t (20
-
8/12/2019 Myers2012SEIF Slides
24/50
-
8/12/2019 Myers2012SEIF Slides
25/50
Study of APIs for SAP
Study APIs for EnterpriseService-Oriented Architectures (Web Ser
Naming problems:
Too long
Not understandable
Differences in middle are frequently missed
CustomerAddressBasicDataByNameAndAddressRequestMessageCustomerSelectioCustomerAddressBasicDataByNameAndAddressResponseMessageCustomerSelec
-
8/12/2019 Myers2012SEIF Slides
26/50
eSOA Documentation Resu Multiple paths: unclear which one to use
Some paths were dead ends
Inconsistent look and feel caused immediatabandonment of paths
Hard to find requiredinformation
Business backgroundhelped
-
8/12/2019 Myers2012SEIF Slides
27/50
-
8/12/2019 Myers2012SEIF Slides
28/50
Our Tools to Help with APIs
Mica Jadeite
Calcite
Euklas
Graphite
http://images.google.com/imgres?imgurl=http://www.orientaljadejewelry.com/DSCN0187.JPG&imgrefurl=http://www.orientaljadejewelry.com/bangles.htm&h=480&w=640&sz=33&hl=en&start=80&usg=__8TwN8oO0hOBrRBDl-NNOisyBsi4=&tbnid=7Hnu7F-4FzBLHM:&tbnh=103&tbnw=137&prev=/images?q=jadeite&start=60&ndsp=20&hl=en&rls=IBMA,IBMA:2006-17,IBMA:en&sa=N -
8/12/2019 Myers2012SEIF Slides
29/50
Mica Tool to Help Find Example
Makes Interfaces Clear andAccessible Use Google to find relevant
pages
Match pages with Javakeywords
Also notes which pagescontain example code
or definitions
-
8/12/2019 Myers2012SEIF Slides
30/50
Jadeite: Improved JavaDoc
Jadeite: JavaAPI Documentation with ExtrInformation Tacked-on for Emphasishttp://www.cs.cmu.edu/~jadeite
Fix JavaDoc to help address problems
Focus attention on most popular packages andclasses using font size
Placeholders for methods that users want to exist
Automatically extractedcode examples for how
to create classes
http://www.cs.cmu.edu/~jadeitehttp://www.cs.cmu.edu/~jadeite -
8/12/2019 Myers2012SEIF Slides
31/50
Calcite: Eclipse Plugin for Ja
Calcite: ConstructionAnd Language Comp
Integrated Throughouthttp://www.cs.cmu.edu/~calcite
Code completion in Eclipse augmented w
Jadeites informationHow to create objects of specific classes
SSLSocket s = ???
http://www.cs.cmu.edu/~calcitehttp://www.cs.cmu.edu/~calcite -
8/12/2019 Myers2012SEIF Slides
32/50
Euklas: Eclipse Plugin for JavaScr
Euklas: Eclipse Users Keystrokes Lessened
byAttaching from Sampleshttp://www.cs.cmu.edu/~euklas
Brings Java-like analysis to JavaScript
Auto-correct usescopy source contextfor errors due tocopy & paste
http://www.cs.cmu.edu/~euklashttp://www.cs.cmu.edu/~euklas -
8/12/2019 Myers2012SEIF Slides
33/50
Graphite: Eclipse Plugin for Litera
Graphite: GRAphical Palettes Help Instant
Types in the Editor.
Pop up a custom palette for specialized co(literals) in Eclipse
Color palettesRegular expression
strings
Customizable (ICSE2012)
-
8/12/2019 Myers2012SEIF Slides
34/50
Apatite Documentation Tool
Apatite:Associative Perusing ofAPIs That
Identifies Targets Easilyhttp://www.cs.cmu.edu/~apatite
Start with verbs (actions)
and properties and find whatclasses implement them
Find associated items
E.g., classes that are often
used together
http://www.cs.cmu.edu/~apatitehttp://www.cs.cmu.edu/~apatite -
8/12/2019 Myers2012SEIF Slides
35/50
Studies of Code Understan Thomas LaToza, PhD 2012
Studies about how experts learn unfamiliar c
Programmers investigate reachability questio
How can this code be reached, either upstream o
E.g., control flow from user scrolling update sta
Identified over 100 hard-to-answer questiondevelopers asked
E.g., What method implements this trigger?
Why was this designed this way?
Survey shows such control flow questions ar
-
8/12/2019 Myers2012SEIF Slides
36/50
REACHER
Visualize exactly the paths of interest
Searchalong the paths
Focused questions and answers enable effective acomplex codebases
Developers with Reacher 5.6times more success
those working with Eclipse only
http://../Advisor/Thomas%20LaToza/Defense%20Talk/Defense%20Talk%204.ppt_media/reacher%20demo.mov -
8/12/2019 Myers2012SEIF Slides
37/50
-
8/12/2019 Myers2012SEIF Slides
38/50
Backtracking Results
All developers backtrack for many reasoExplorations, investigations, iterative design
People use comments to remove code, s
can restore it if necessaryBut difficult to comment & uncomment corr
Often non-local changes
Undo not used for exploration, just typo
Future work: new tool to help developer
-
8/12/2019 Myers2012SEIF Slides
39/50
Summary
30 studies; 17 systems in 16 years
Doing studies first provides new insican inspire significantly new designs
programming languages and environ
Need to understand software engineissues
-
8/12/2019 Myers2012SEIF Slides
40/50
Thanks to: Funding:
NSF under IIS-1116724, IIS-0329090, CCF-0811610, IIS-0757IT), NSF ITR CCR-0324770 as part of the EUSES Consortium
SAP
Adobe
IBM
Microsoft Research RISE >30 students: Htet Htet Aung Jack Beaton Ruben Carbonell John R. Chang Kerry S Chang
Andrew Faulring Aristiwidya B. (Ika) Hardjanto Erik Harpstead Sae Young (Sophie) Jeong Andy Ko
Stephen John Pan Sunyoun Chotirat
Ratanam
-
8/12/2019 Myers2012SEIF Slides
41/50
ImprovingSoftware Development thro
Human-Centered ApproacBrad A. Myers
Human-Computer Interaction School of Computer ScienCarnegie Mellon Univers
B T l f A h
-
8/12/2019 Myers2012SEIF Slides
42/50
Better Tools for Autho
Interactive Behavior
ConstraintJS
Brad Myers & Stephen Oney
Human-Computer Interaction InstituSchool of Computer Science
Carnegie Mellon University
Carnegie Mellon - 2012
I t ti S ft
-
8/12/2019 Myers2012SEIF Slides
43/50
Interactive Software
Today: programmed with callbacks & si
Result: interdependent, complex code
Carnegie Mellon - 2012
C t i t
-
8/12/2019 Myers2012SEIF Slides
44/50
Constraints
Relationships declared once and maintain
automatically
Can help reduce the complexity of interac
In GUI programming, constraints have cau
Data bindings (example: WPF, Silverlight)
Layout controllers (example: CSS)
Carnegie Mellon - 2012
ConstraintJS
-
8/12/2019 Myers2012SEIF Slides
45/50
ConstraintJS
Constraints for building interactive software
Integrates constraints with Finite-State Mac(FSMs)
Makes it easy to create constraints that someti
Result: Cleaner, clearer code Works with Web languages (JavaScript, HTM
(paper to appear at UIST2012)
Carnegie Mellon - 2012
Motivating Example
-
8/12/2019 Myers2012SEIF Slides
46/50
Motivating Example
Carnegie Mellon - 2012
-
8/12/2019 Myers2012SEIF Slides
47/50
ConstraintJS implementationR i f llb k d id ff t d
-
8/12/2019 Myers2012SEIF Slides
48/50
Carnegie Mellon - 2012
1 f ri ends = cj s. async( f b_r equest ( "/ me/ f r i ends") ) ;
2 pi cs = f r i ends. map( f uncti on( f r i end) {3 return cj s. async( f b_r equest ( " / " + f r i end. i d4 + "/ pi ctur e") ) ;5 } ) ;67 / / . . .89 {{#di agr am f r i ends. stat e}}
10 {{#st ate pendi ng }} Loadi ng f r i ends. . .
11 {{#st ate r ej ect ed}} Er r or12 {{#st ate r esol ved}}13 {{#each f r i ends f r i end i }}14 {{#di agr am pi cs[ i ] . s tate}}15 {{#st ate pendi ng }} 16 {{#st ate r esol ved}} 17 {{#st ate r ej ect ed}} 18 {{/ di agr am}}19 {{f r i end. name}}20 {{/ each}}
21 {{/ di agr am}}
Requires fewer callbacks and no side-effect code
Clearer and less interdependent code
Enhances HTML syntax to add flexibility while maintaining clarity
Current Work
-
8/12/2019 Myers2012SEIF Slides
49/50
Many interactive behaviors can be specif
onlya combination of FSMs and constrai
Interactive tool for specifying FSMs & co
Spreadsheet-like for constraints, with colum
states
Carnegie Mellon - 2012
Acknowledgements
-
8/12/2019 Myers2012SEIF Slides
50/50
Acknowledgements
Microsoft SEIF Award, 2011
Joel Brandt & Adobe
Ford Foundation
National Science Foundation
Website: www.constraintjs.com
Carnegie Mellon - 2012