SilverStripe 3.0 UI designs
Upcoming SlideShare
Loading in...5
×
 

SilverStripe 3.0 UI designs

on

  • 2,577 views

Our creative director, Felipe Skroski, presents work in progress on the interface for SilverStripe CMS 3.0, and the process SilverStripe is following for its development....

Our creative director, Felipe Skroski, presents work in progress on the interface for SilverStripe CMS 3.0, and the process SilverStripe is following for its development.

The latest user interface design work for SilverStripe CMS 3 can be always found at: github.com/​silverstripe/​silverstripe-design/​blob/​master/​Design/​, and we welcome feedback at groups.google.com/​group/​silverstripe-dev/​

Statistics

Views

Total Views
2,577
Views on SlideShare
2,172
Embed Views
405

Actions

Likes
2
Downloads
28
Comments
0

5 Embeds 405

http://www.silverstripe.org 178
http://silverstripe.org 174
http://www.scoop.it 51
http://twitter.com 1
http://translate.googleusercontent.com 1

Accessibility

Categories

Upload Details

Uploaded via as Apple Keynote

Usage Rights

© All Rights Reserved

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
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n

SilverStripe 3.0 UI designs SilverStripe 3.0 UI designs Presentation Transcript

  • SS3 UI Redesign Vision, process and outcomes
  • The vision
  • Keep it modular, flexible and scalable
  • Good defaults and robust design framework to help developers build UIs
  • User centered design
  • Reduce, reuse, recycle (when possible)
  • Context over consistency (one size doesn’t fits all)
  • Improve marketing capabilities (analytics, reports, ads)
  • Web presence manager(website, SEO, social networks, cloud, APIS)
  • Prepared for mobile and touch devices
  • The process
  • HCDHuman Centered Design
  • Why?
  • “Because it can help us connect better with people we serve”
  • “It can transform data into actionable ideas”
  • “It can help us see new opportunities”
  • “It can help us increase the speed andeffectiveness of creating new solutions”
  • How does it work?
  • HCD’s 3 lenses:desirability feasibility viability What do What is What can be people technically financially desire? feasible? viable?
  • viabilitystart here desirability solutions feasibility
  • H C D hear create deliver themes opportunitiesabstractconcrete stories solutions prototypesobservations implementation
  • Hhear
  • 1 Existing knowledge: •10 years of experience •Developers •Designers •PMs •Community
  • 2 Interviews: •6 users - newbies to experts •Interview & observation •In-context immersion
  • 3 Outcomes: •User stories and scenarios •Personas •Deep understanding of desires, barriers and constraints
  • Personas
  • Che: Casual editor / author
  • Why can’t I just edit content on mywebsite?I’m not tech savvyI don’t have time to learn using itI don’t know about html, css, or codeI’m too busy with other stuffI use word and excel, can I copy andpaste?
  • Yummy: Web admin
  • I need to manage site structure easilyI want to extend functionality withoutcodeHas to be easy to learn, do you havetutorials?I love stats this tells me what I need tochangeI need clever tools to promote my websiteexternally and connect with my webpresenceI want many modules and themesavailableI manage who can do what on the site
  • Mr Chang: Web designer
  • I want total control of design, markupand jsThe templates should be easy to learnI need good tutorials and documentationI want to say how much freedomusers have to change my designI can do some hacks in PHPbut I’m not a coderI want to change my themes easilyI want easy to install modules
  • Ali: Php guru
  • I want light and powerful framework.Easy to change and extendGood tutorials, documentation, andactive communityI want to make the mostof my code skillsIt should be easy to install on myconfigurationI need an easy way to createthe UI for usersReal men use the terminalCode is poetry
  • Ccreate
  • Create activities:•Identify patterns and themes•Prototypes (sketch /wireframe / mockup)•Test & feedback
  • 1 Patterns & themes •Less abstraction (website x admin) •Task oriented flow (less info = more attention) •Web presence manager •Mobile & touch devices •Social Networks •Web Apps builder
  • 2 Prototypes
  • #fail
  • 3 Test & feedback •SS3 dev-group (google groups) •Github (silverstripe-design) •User test (future) •A/B testing (future)
  • Ddeliver
  • Deliver activities1. Evaluate feasibility and viability2. Identify capabilities and resources3. Create an implementation timeline4. Execute (design / code)5. Iterate6. Evaluate
  • Latest designs
  • Know more & help• human centered design• silverstripe design github• silverstripe dev list• sapphire framework
  • Questions?
  • Thank you