semtechbiz uk 2011: aloha web editable
DESCRIPTION
Aloha Web Editable. The Semantic Interaction Framework or How Editing Can Save 25% of Your Costs.Using Aloha Editor, Apache Stanbol and the VIE RDFa JavaScript bridgeTRANSCRIPT
![Page 1: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/1.jpg)
Aloha! Web Editable
The Semantic Interaction Frameworkor How Editing Can Save 25% of Your Costs
September 2011 | London / UK
Rene Kapusta | evo42 communications Ltd. | http://evo42.net
![Page 2: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/2.jpg)
Edit the web using semantic annotations.
No forms required!
http://twitter.com/rene_kapustamailto:[email protected]
http://slideshare.net/evo42
http://semantic-cms.info
![Page 3: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/3.jpg)
What‘s the problem with
semanticweb editing?
![Page 4: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/4.jpg)
You often edit data that is not visible. Metadata.
99.9% of the users are no hackers. Keep it simple!
![Page 5: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/5.jpg)
it‘s about experience
![Page 6: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/6.jpg)
experience is big things
![Page 7: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/7.jpg)
experience is small things
![Page 8: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/8.jpg)
experience is BAD
![Page 9: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/9.jpg)
small details
![Page 10: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/10.jpg)
BIGDIFFERENCE
![Page 11: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/11.jpg)
experience can makesomething special
![Page 12: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/12.jpg)
![Page 13: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/13.jpg)
loading ...
![Page 14: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/14.jpg)
good experience? not even for geeks
![Page 15: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/15.jpg)
loading ...
![Page 16: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/16.jpg)
WYSIWYG - like MS Word
WYSIWYG ( /ˈwɪziwɪɡ/ WIZ-ee-wig) is an acronym for what you see is what you get. The term is used in computing to describe a system in which content displayed during editing appears exactly very similar to the final output, which might be a printed document, web page, or slide presentation.
![Page 17: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/17.jpg)
WYSIWYG? a bit at least
![Page 18: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/18.jpg)
confusing? for people working with content
![Page 19: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/19.jpg)
where do they come from?45 billion pages on google
![Page 20: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/20.jpg)
internet users
where does the content of45 billion pages come from?
![Page 21: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/21.jpg)
internet users
where does the content of45 billion pages come from?
99,9 % user != hacker
![Page 22: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/22.jpg)
content authored withopen source cms or other systems
![Page 23: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/23.jpg)
How to save 25% of your editing costs?
![Page 24: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/24.jpg)
How to save 25% of your editing costs?Work more efficient!
![Page 25: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/25.jpg)
no markup! html, wiki markup, bbcode, ...
![Page 26: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/26.jpg)
no reload! click edit, click preview and save
![Page 27: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/27.jpg)
no menu rubbish! no need for all icons all the time
![Page 28: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/28.jpg)
just edit
![Page 29: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/29.jpg)
it‘s abouttechnology
![Page 30: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/30.jpg)
it‘s aboutopen source
![Page 31: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/31.jpg)
open source matters
![Page 32: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/32.jpg)
• Interactions should react in realtime and give immediate feedback to the user.
• The user should see the exact result of its action immediately.
• No apply or confirm action should be necessary. It's done when you do it.
• Instead everthing can be reverted.
• Every action should be completed with the minimum possible interactions.
• Everything that can be done automatically should be done automatically.
Inline HTML5 WYSIWYG editor
![Page 33: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/33.jpg)
no browser crap! contenteditable in browsers
![Page 34: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/34.jpg)
reduce clicks! CTRL+V that‘s it. no extra clicks!
![Page 35: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/35.jpg)
no iframes uses html contenteditable
![Page 36: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/36.jpg)
slick functionality - there when you need it
multiple repositories are supported
![Page 37: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/37.jpg)
HTML5 is the answerto the Ultimate Question of Life,the Universeand Everything
![Page 38: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/38.jpg)
web page view just click to edit!
![Page 39: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/39.jpg)
page edit view intuitive menu
![Page 40: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/40.jpg)
edit the cube all visible content is editable
http://aloha-editor.org/demos/css3/
![Page 41: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/41.jpg)
Improve the interaction process and save costs!
Measured with the KeyStroke-Level-Model (KLM)
for the calculation we us the numbers from wikipedia.org
1) http://stats.wikimedia.org/EN/TablesWikipediaEN.htm 2) http://en.wikipedia.org/wiki/Wikipedia:Time_management
4,000,000 edits 1)
2 min per edit “two minutes to execute. In reality it probably takes longer”2)
8,000,000 min editing per month (≈4h/user per month)$25 cost per hour per user
$3,333,333 cost per month
SAVE $10,000,000 per year
$833,333 per month
Every action should be completed with the minimum possible interactions.
![Page 42: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/42.jpg)
Apache Stanbol
• Persistence: services that store (or cache) semantic information and make it searchable
• Lifting/Enhancement: services that add semantic information to “non-semantic” pieces of content
• Knowledge models and reasoning: services that enhance the semantic information
• Interaction: intelligent user interface management and generation
RESTful Semantic Engine
![Page 43: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/43.jpg)
VIE
• Make the content of your web pages editable through annotations
• Load RDFa entities as JavaScript objects
• Sync changes to server, and to DOM
• Works client and server-side (node.js)
RDFa JavaScript Bridge
![Page 44: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/44.jpg)
Resources
Aloha Editor -- http://aloha-editor.org Apache Stanbol -- http://incubator.apache.org/stanbolIKS Project -- http://iks-project.eu VIE -- https://github.com/bergie/VIE
Drupal Demo -- http://semantic-cms.infoVIE^2 Demo -- http://iks.dfki.de/showcase2/demos/VIE Palsu Demo -- http://palsu.me
![Page 45: SemTechBiz UK 2011: Aloha Web Editable](https://reader034.vdocument.in/reader034/viewer/2022051323/5479d86fb379596a2b8b486b/html5/thumbnails/45.jpg)
• Haymo Meran, Gentics @draftkraftAloha Editor Mastermind
• Henri Bergius, Nemein @bergieVIE Mastermind
• IKS Project Team@iks_project
credits
Imageshttp://www.flickr.com/photos/bluecanoe/41268275http://www.flickr.com/photos/huffduff/5107515869http://www.flickr.com/photos/philipwilliamson/2500558623http://www.worldwidewebsize.com/Graph_v1.php?Searchengine=Google&corpus=0&Last=730http://trends.builtwith.com/cmshttp://www.flickr.com/photos/dullhunk/3947536364/