Smwcon widget editor - first preview


Published on

A semantic visual widget editor prototype built on top of semantic mediawiki to enable metadata programming and easy social semantic application development

Published in: Technology
  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Smwcon widget editor - first preview

  1. 1. SMWCon Spring 2011, Arlington VA, USA April 29, 2011 Jesse Wang | Ning Hu
  2. 2. What is Widget Editor –™ Widget Editor is a part of the wiki infrastructure to make Semantic MediaWiki a social semantic web application development platform™ To let people build web applications through metadata and GUI –  Lowering the bar for people to develop web applications™ Still a very work-in-progress prototype (first alpha)
  3. 3. Agenda –Motivation Vision Live Demo Design Discussion, Q&A
  4. 4. Motivation –Why we want to do this?
  5. 5. Usage of SMW –™ Collaboration™ Collecting structured data™ Sharing information™ Management of heterogeneous data™ Simple workflow management™ User-generated arbitrary queries™ Data analysis and information discovery
  6. 6. Common Work Items –™ Schema design™ Extension choices™ Forms™ Template™ Skins™ Queries
  7. 7. Expert in Need –
  8. 8. Vision – It could be a lot easier…Let’s start with some widgets…
  9. 9. Focus on Content –™ Most users just like to build contents –  CMS: Drupal, WordPress, MW/ SMW, … –  SNS: MySpace, Ning, WetPaint, LinkedIn, …™ Frameworks allows people to focus on content or data
  10. 10. Data and Metadata –™ Frameworks let users set “meta-data” –  So they can customize the content™ Users contribute and customize –  via meta-data ™  including parameters™ Users can build systems or content repository –  via meta-data (parameters)
  11. 11. Metadata as Glue –™ Metadata to glue code and content™ It brings power and flexibility in this paradigm: –  More metadata è Higher customizability –  More linkage èHigher flexibility™ In Semantic MediaWiki –  Metadata = Special Wiki Data ™  Template, category, property, etc.
  12. 12. Metadata Programming –™ Existing examples: –  “Allowed values” è Auto-completion in SF –  “has default form” è Map form to data (category)™ We want to enhance the experience –  “has range” è auto-completion in Semantic Forms –  “has domain” è auto-construct form for the domain –  “has label/description” è metadata to use in forms –  “has style” è the visual part of customization
  13. 13. Object-Oriented –™ OOAD is something quite old now –  Is OOAD in SMW application development?™ Do we have tools to help user with OOAD?™ Any Design Patterns to help?™ Model-View-Controller (MVVM) –  Does the model get linked to view nicely?
  14. 14. Widget as Objects –™ Category and widget hierarchy –  Each category is a domain (class) –  Each category has a widget –  Widget reflects category hierarchy –  Animal è Person è Employee, Patient™ Widget can embed other widgets –  Aggregation to make application construction easier –  Object “Person” contains object “Address” which has “State”, “City”, etc.
  15. 15. Widget as UI –™ Widget has a collection of fields –  Each field is linked to a property –  Each field gets metadata from associated property ™  Type (Date, Number, Widget, …) ™  Has domain and range…™ Widget is also a user interface to edit and view wiki content –  Editing form can be automatically generated
  16. 16. Live Demo –Among the first to see how it works
  17. 17. Demo Recap –™ Widget Designer –  Data type (Number, File/Image, Page, …) –  Range (number range, enumeration, query) –  Live widget view –  Open architecture –  And more™ Action Connector –  Action link between widget fields™ Automatic Form Generation
  18. 18. WE Design – How we did it
  19. 19. SMW and OO –™ Category è Class™ Property è Attributes™ Page in a category è Instance of a class™ Data in a page è attribute values of an instance™ Bringing OO into SMW is not too hard
  20. 20. SMW and MVC –™ Model == category + property + template field?™ View == template?™ Controller == template + parser function?™ More complicated and convolved …™ We are not using *semantic* in SMW
  21. 21. WE Model – Person Sub WidgetAddress Name Sup Widget Field Field Employee MW + SMW Prop Prop Field Field Company Prop Prop Template Sub Cate Template Patient Disease Super Category
  22. 22. WE View –
  23. 23. WE Control –™ Field-Internal constraint defined in “Model” –  Property “Allows value” –  “#wfallowsvalue”™ Field-External constraint defined by “Action Connector” –  Associate with parser function
  24. 24. WE Form –™ The editing view (input form) is automatically generated using the metadata™ User can control: –  Label –  Table or Section (horizontal vs. vertical layout) –  Infobox (with header or not) –  Some styles –  Order (index) –  And more to be added
  25. 25. WE Act –™ Action Connector to dynamically modify the metadata™ Upon changes in related field’s values™ Provide richer interaction / transaction among the fields (properties)™ All these are meta-data
  26. 26. Discussion –It’s our first demo, we’ll have a lot to do We need your help.
  27. 27. WE Need Feedback –™ “What if we build something that nobody uses?” J™ Will it be useful?™ If yes, are you willing to help? –  Help us with development –  Be our first customers
  28. 28. Thank You! –™ Questions, suggestions and comments?