• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
UX-Vision for the next TYPO3 CMS
 

UX-Vision for the next TYPO3 CMS

on

  • 3,998 views

In this presentation you will see a short retrospective of the past TYPO3 versions. Followed up by a status quo of the current TYPO3 CMS version which lead to some UX suggestion. And than our Vision ...

In this presentation you will see a short retrospective of the past TYPO3 versions. Followed up by a status quo of the current TYPO3 CMS version which lead to some UX suggestion. And than our Vision via some detailed layouts by the "TYPO3 CMS Usability Team" for a possible future major release of the TYPO3 CMS.

Try the simple interactive prototype: http://j.mp/T37-vision-proto
And watch the full Talk at T3CON13: http://j.mp/T37-vision-talk

Your constructive feedback is very welcome!
Open up a issue at http://j.mp/T3cmsUX or mail me.

Statistics

Views

Total Views
3,998
Views on SlideShare
2,716
Embed Views
1,282

Actions

Likes
4
Downloads
10
Comments
0

5 Embeds 1,282

http://www.typo3.ru 812
https://twitter.com 462
http://typo3.ru 5
https://www.facebook.com 2
http://www.linkedin.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

CC Attribution-NonCommercial-NoDerivs LicenseCC Attribution-NonCommercial-NoDerivs LicenseCC Attribution-NonCommercial-NoDerivs License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    UX-Vision for the next TYPO3 CMS UX-Vision for the next TYPO3 CMS Presentation Transcript

    • UX-Vision for the next TYPO3 CMS TYPO3 CMS Usability Team
    • Web Hello. TYPO3 CMS UX-Team Leader Creative Director jens@typo3.org
 @wrybit | www.wrybit.de
    • Web Jens. Living together with my wife, 
 sun and 2 cats near Frankfurt jens@typo3.org
 @wrybit | www.wrybit.de
    • Web WrYBiT. I like snowboarding, electronic music, visiting art exhibitions & digging into new UX challenges jens@typo3.org
 @wrybit | www.wrybit.de
    • Indifferences. Lack of strategy. Non-profit corporation. Freedom. Thinking bold. Inspiring. collaboration. Team Participation. Spirit of sharing. Open Source Passion for contribution. Focus on Never finished. quality over quantity. Exchanging thought. Fair fame. Community engagement. Flat hierarchy. Flexibility.
    • The UX-Team Long term support of the TYPO3
    • The TYPO3 CMS UX-Team Long term support of the TYPO3 CMS
    • Members Martin Engel Björn Brockmann Fabien Udriot Felix Kopp Team Leader Release Manager Jens Hoffmann Ernesto Baschny Lars Zimmermann
    • Challenge Product Maintain Innovate Vision & Strategy Community Feedback Motivate Moderate Build Inspire Support Team
    • Retrospective
    • The evolution of iMac 1998 2000 2002 2004 2005 2007 2009 Today
    • Status quo Aspects of a historically grown system.
    • This is my personal perspective and not approved by any other official TYPO3 team. TYPO3 CMS TYPO3 Neos TYPO3 Flow 
 CMS CMS Revolution 
 
 Framework 
 
 Evolution Framework Web-Sites 
 
 Framework Web-Apps (with GUI) Web-Services (without GUI)
    • This is my personal perspective and not approved by any other official TYPO3 team. 
 CMS TYPO3 Neos Same TYPO3 CMS TYPO3 Flow CMS Revolution Difference 
 Web-Sites Framework 
 
 
 Same Evolution Framework 
 
 Framework Web-Apps (with GUI) Web-Services (without GUI)
    • iFrames From a technical depth to a technical chance?
    • ~100 Core modul views
    • With .. & without tree
    • With .. & without tree User tools System Web Admin tools File Help Tree
    • Linear workflow
    • Text w/ Image Open Page Modul Create Page Create Record Select Record Type Write Text Add Metadata Save & Close Record Open File Modul Select Folder Enter Upload Modul Browse local filesystem Select local Image Upload File Add Metadata Re-Open Page Modul Re-Select Page Re-Select Content Element Select Media Tab Open T3-FileBrowser Re-Select Folder Re-Select & Insert Image Open Preview Modul Navigate to Page Preview Text /w Image Save & Close Record
    • 25 steps
    • Text w/ Image Open Page Modul Create Page Create Record Select Record Type Write Text Add Metadata Save & Close Record Open File Modul Select Folder Enter Upload Modul Browse local filesystem Select local Image Upload File Add Metadata Re-Open Page Modul Re-Select Page Re-Select Content Element Select Media Tab Open T3-FileBrowser Re-Select Folder Re-Select & Insert Image Open Preview Modul Navigate to Page Preview Text /w Image Save & Close Record
    • Summary ‣ Product vision or strategy bit unclear ‣ iFrames separate Menus & Moduls ‣ Linear, technical driven workflows ‣ Current grouping by technical context ‣ Long, recurrent click paths for editors
    • Suggestions ‣ User and content first ‣ Define defaults for beginners ‣ Enable non-linear workflows ‣ Features on demand ‣ Prefer existing solutions ‣ Create small & re-usable parts ‣ Avoid abstraction where possible
    • Vision Teamwork, fifth iteration
    • Iterations
 From Idea to Layout Idea Jens Draft Lars Wireframe Björn & Jens T3UX-RLM Jens T3CON13 Martin & Jens
    • Iterations
 From Idea to Layout T3CON13 Martin & Jens
    • Backend Login
    • Backend Login
    • Backend Login
    • Welcome dialog (TourTorial start)
    • Dashboard
    • Dashboard (Add widget)
    • Dashboard (Widget added)
    • Welcome dialog („TourTorial“ started)
    • Open a new module (TourTorial)
    • TourTorial: Interact with the pagetree
    • Open a new module (TourTorial)
    • Open a new module (TourTorial)
    • Grid view
    • Grid view (Add content, via Drag & Drop)
    • Grid view
    • Grid view
    • Grid view
    • Grid view
    • Quick editing Distraction free editing A designer who wants to achieve good design must
    • Distraction free editing A designer who wants to achieve good design must not regard himself as an artist who, according to taste and aesthetics, is merely dressing up products with a last - minute garment. The designer must be the gestaltingenieur or creative engineer. They synthesise the completed product from the various elements that make up its design. Their work is largely rational, meaning that aesthetic decisions are justified by an understanding of the product’s purpose. _
    • Quick editing Distraction free editing A designer who wants to achieve good design must
    • Quick editing (Switch context)
    • Quick editing (Switch context, Context Informations)
    • Device simulation
    • Open a new module (Tab)
    • Wizard workflow (Step 3, Check report)
    • Summary True branding possibilities ‣ Less navigation, consistent styling & more space ‣ New learning curve via inline „TourTorials“ ‣ Non-Linear workflow via Tabs ‣ Personae/Roles via Tab-Sets ‣ Context focused grouping and view switches ‣ Device simulator and distraction free editing ‣ Transparent Sub-Modul-Navigation ‣ Simple wizard driven workflows ‣
    • TYPO3 USER EXPERIENCE WEEK It‘s time for another one!
    • T3UXW09
    • Event participants 2009
    • T3UXW09 Achievements ‣ New Backend-, Login-, Installer & Error-Skin ‣ Creation of the Introduction Package ‣ Built new page- and file-tree from scratch ‣ Page Module backend grid & grid layout editor ‣ Page Module with „drag & drop“ ‣ Smart renaming & rearrangement of labels ‣ Basic TYPO3 backend template structure & guide ‣ Core Sprite-Image- & CSS-Merger-Engine ‣ Better Backend Search ‣ …
    • Honorable T3UXW09 godparents .. thank you, once again!
    • T3UXW14
    • # T3UXW14
    • 16.02 - 23.02.2014 Essen - Unperfekthaus
    • Dev 1 Dev 2 Dev 3 Dev 4 Dev 5 Dev 6 UX Coordination
    • Today Website will be ready „hopefully“ soon.
    • … send a mail to t3uxw@typo3.org
    • Become a godparent 900€ Support 1 Attendee
    • I’m open for new job opportunities in 2014. Thanks Got questions? jens@typo3.org
 @wrybit | www.wrybit.de