• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Front-end Pattern Libraries
 

Front-end Pattern Libraries

on

  • 1,164 views

Presentation given to IXDA Singapore on 27 Feb 2014.

Presentation given to IXDA Singapore on 27 Feb 2014.
The presentation describes front-end pattern libraries and introduces Tapestry, a front-end pattern library manager (or app).

Statistics

Views

Total Views
1,164
Views on SlideShare
1,156
Embed Views
8

Actions

Likes
1
Downloads
6
Comments
0

2 Embeds 8

http://www.linkedin.com 5
http://www.slideee.com 3

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

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

    Front-end Pattern Libraries Front-end Pattern Libraries Presentation Transcript

    • presents Front-end pattern libraries Vinay Malankad & Maish Nichani www.pebbleroad.com
    • We are PebbleRoad • Singapore-based Enterprise UX consultancy • Innovating since 2004 • Team of specialists • Culture of innovation and design leadership
    • Pattern libraries Tapestry What it is Why do we need one What it is How to use What is the tech How to install
    • FE Pattern library = content + interaction + visual + code
    • Title Code Usage notes Presentation http://patterns.alistapart.com/
    • https://ux.mailchimp.com/patterns
    • Why UXUXFE + CMS give prototype + psd can’t recognise work give html templates new templates fail give modular code can’t screw up
    • When maintenance UX CMS UX UX
    • Benefits Production-quality Modular Reusable Extendable Smart!
    • Tapestry Interface Core CSS + JavaScript
    • Customise it! Interface Customise Customise Core CSS + JavaScript
    • Tapestry demo http://demos.pebbleroad.com/tapestry/src/ intro patterns + pattern - pattern _tech installation
    • pages Patterns feedback + content templates feedback components tabs elements table
    • Interface JSON Patterns
    • Installation Dependency  -­‐  Gulp  (NodeJS)   ! $ git clone https://github.com/PebbleRoad/tapestry.git ! $ cd tapestry ! $ npm install && bower install ! $ gulp patterns ! # Open http://localhost:8000 in your browser
    • Next steps Unit testing of the app Share a pattern Pattern version history
    • http://www.fivesimplesteps.com/products/front-end-style-guides
    • A free service that saves you time in sharing hard-to-spell or hard-to-understand info with customer service reps. ! www.copymyinfo.com
    • www.pebbleroad.com