semtechbiz uk 2011: aloha web editable

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

Edit the web using semantic annotations.

No forms required!

http://twitter.com/rene_kapustamailto:rene@evo42.net

http://slideshare.net/evo42

http://semantic-cms.info

What‘s the problem with

semanticweb editing?

You often edit data that is not visible. Metadata.

99.9% of the users are no hackers. Keep it simple!

it‘s about experience

experience is big things

experience is small things

experience is BAD

small details

BIGDIFFERENCE

experience can makesomething special

loading ...

good experience? not even for geeks

loading ...

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.

WYSIWYG? a bit at least

confusing? for people working with content

where do they come from?45 billion pages on google

internet users

where does the content of45 billion pages come from?

internet users

where does the content of45 billion pages come from?

99,9 % user != hacker

content authored withopen source cms or other systems

How to save 25% of your editing costs?

How to save 25% of your editing costs?Work more efficient!

no markup! html, wiki markup, bbcode, ...

no reload! click edit, click preview and save

no menu rubbish! no need for all icons all the time

just edit

it‘s abouttechnology

it‘s aboutopen source

open source matters

• 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

no browser crap! contenteditable in browsers

reduce clicks! CTRL+V that‘s it. no extra clicks!

no iframes uses html contenteditable

slick functionality - there when you need it

multiple repositories are supported

HTML5 is the answerto the Ultimate Question of Life,the Universeand Everything

web page view just click to edit!

page edit view intuitive menu

edit the cube all visible content is editable

http://aloha-editor.org/demos/css3/

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.

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

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

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

• 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/