A design system is a scalable framework of decisions & team behaviors spread across an organization so your products can converge on a cohesive experience. Start your plan with a firm understanding of what parts it includes, products it applies to, and people that will do the work.
Jensen Harris: Beyond Menus and Toolbars in Microsoft OfficeSteve Williams
BayCHI December, 2005, Program: Long before the launch of the new Office product, the BayCHI community was eager to understand the new "Ribbon" user interface (UI). Members convinced BayCHI program chair Rashmi Singha to bring in Jensen Harris, the lead UI designer for the Office UI suite. It is atypical of Microsoft's culture to allow someone to discuss a product before launch. But, alongside the serious risk of completely redoing a core product, and giving all the design control to a team of user experience designers, Microsoft is opening the black box and explaining it to the public far before launch.
A talk I gave on Mobile IA at the University of Washington iSchool's Information Architecture Summer Institute. Presented in Seattle, June 2012.
[Originally uploaded to Slideshare June 21, 2012]
A design system is a scalable framework of decisions & team behaviors spread across an organization so your products can converge on a cohesive experience. Start your plan with a firm understanding of what parts it includes, products it applies to, and people that will do the work.
Jensen Harris: Beyond Menus and Toolbars in Microsoft OfficeSteve Williams
BayCHI December, 2005, Program: Long before the launch of the new Office product, the BayCHI community was eager to understand the new "Ribbon" user interface (UI). Members convinced BayCHI program chair Rashmi Singha to bring in Jensen Harris, the lead UI designer for the Office UI suite. It is atypical of Microsoft's culture to allow someone to discuss a product before launch. But, alongside the serious risk of completely redoing a core product, and giving all the design control to a team of user experience designers, Microsoft is opening the black box and explaining it to the public far before launch.
A talk I gave on Mobile IA at the University of Washington iSchool's Information Architecture Summer Institute. Presented in Seattle, June 2012.
[Originally uploaded to Slideshare June 21, 2012]
Introducing communication sites for communicators #spsottawaKanwal Khipple
Are you an internal communicator who owns and manages the intranet? Are you looking to redesign your intranet but are not sure how Microsoft's Modern Communication sites fit into your project? Attend this session to learn about what features Communication Sites provide and how you can leverage them. This session will also be demo heavy to showcase key features that are available for 1st Release users in Office 365 tenants.
This open forum panel discussion for AIGA UCLA was presented by Lynn Boyden, Chris Chandler, Jose Caballer and Lara Fedoroff. Deemed "UX for Dummies" this discussion focused on the definition, process, deliverables and challenges of User Experience verses Information Architecture.
During a time when 10% of the country is out of work (and presumably looking for a new job), how do you stand out from the crowd to get noticed and land an interview?
Apply marketing tips and tricks to:
* Find jobs before they ever even exist
* Manage your resume and portfolio in a way that makes it quick and easy to customize for every job
* Build a consistent look and feel for your resume and portfolio
* Add that extra WOW factor with cheap (or free) and easy technology tools
Real World SharePoint Branding - SharePoint Online - SharePoint Saturday Sess...Cathy Dew
How do you design, develop and implement a custom Brand in the SharePoint Online world. We will explore the options and show information on how to develop a great brand for your organization's Office 365 environment.
Understanding Visual Hierarchy in Web DesignHashem Zahran
Visual hierarchy is one of the most important principles behind effective web design. This session will examine why developing a visual hierarchy is crucial on the web, the theory behind it, and how you can use some very basic exercises in your own designs to put these principles into practice.
Information Architecture - Tasks & Tools for Web DesignersDennis Deacon
We may not realize we're doing it, but Information Architecture is being performed transparently as part of our web projects.This presentation highlights the key aspects of this trade and provides some best practices.
There’s a digital design methodology gaining steam that you've likely never heard of, but that could make a big difference in your API design being clean, intuitive, and effortlessly usable for devs who use it. It’s called object-oriented user experience (OOUX).
OOUX is a design power tool that helps us define usable, consistent products that naturally align with end users’ mental models. Similar to its namesake, object-oriented programming, it asks us to define the objects in the real-world problem domain and design the information and relationships in each object before designing how the user might manipulate them. The highly structured nature of OOUX means it directly contributes to clean data modeling and highly portable systems that translate well to exposure via API. It's a powerful tool and it pays dividends fast.
In this session, you’ll get a high-level overview of what OOUX is and why it’s a game-changer, a discussion of the parallels and complementary concerns between OOUX and API design, and an idea of how API design planning could be represented in an OOUX data model.
Presentation originally given at THAT Conference 2021
This is the support deck for an introductory class I made for Junior Designers, Developers, Product and Project Managers to introduce them to the proper way to use wireframes.
I did this class already multiple times at General Assembly (London, UK), TechLab (Santa Clara, CA) and internally in my consulting job.
It's updated to OmniGraffle 6.
Same presentation, with Keynote:
http://www.slideshare.net/folletto/introduction-to-building-wireframes-with-keynote
Introductory overview of Skunk Works' history and the product development culture and engineering environment that resulted from Kelly’s fundamental confidence and belief in his engineers
We’ve all worked at places where there’s never enough time to make sure that things are operationally done the “right way”—bills need to get paid, client or product/project work needs to get done and takes priority, and hey, everyone deserves to have a life, too. There is light at the end of this tunnel! Several companies, including Atari, Ford, Microsoft and Google, have pulled off some great things by taking advantage of skunkworks teams and projects. I’ve been fortunate enough to see some successes with those teams and projects, as well, and will share them so you can see how to apply the approach(es) to your own practice.
Way back in the 1940s, Kelly Johnson and his team of mighty skunks used their Skunkworks process to design—and build—a prototype jet fighter in 143 days. Kelly established 14 Rules and Practices for Skunkworks projects in order to help articulate the most effective way for his team to be successful in the projects that they worked on. Not only can we learn from Kelly’s rules and adapt them to our current methods of working, we can also create our own skunkworks teams and projects to ensure that the Cobbler’s kids—the operational areas of our design practices—get some shoes put on their feet. And the results might just smell pretty good, if you’re patient enough.
Introducing communication sites for communicators #spsottawaKanwal Khipple
Are you an internal communicator who owns and manages the intranet? Are you looking to redesign your intranet but are not sure how Microsoft's Modern Communication sites fit into your project? Attend this session to learn about what features Communication Sites provide and how you can leverage them. This session will also be demo heavy to showcase key features that are available for 1st Release users in Office 365 tenants.
This open forum panel discussion for AIGA UCLA was presented by Lynn Boyden, Chris Chandler, Jose Caballer and Lara Fedoroff. Deemed "UX for Dummies" this discussion focused on the definition, process, deliverables and challenges of User Experience verses Information Architecture.
During a time when 10% of the country is out of work (and presumably looking for a new job), how do you stand out from the crowd to get noticed and land an interview?
Apply marketing tips and tricks to:
* Find jobs before they ever even exist
* Manage your resume and portfolio in a way that makes it quick and easy to customize for every job
* Build a consistent look and feel for your resume and portfolio
* Add that extra WOW factor with cheap (or free) and easy technology tools
Real World SharePoint Branding - SharePoint Online - SharePoint Saturday Sess...Cathy Dew
How do you design, develop and implement a custom Brand in the SharePoint Online world. We will explore the options and show information on how to develop a great brand for your organization's Office 365 environment.
Understanding Visual Hierarchy in Web DesignHashem Zahran
Visual hierarchy is one of the most important principles behind effective web design. This session will examine why developing a visual hierarchy is crucial on the web, the theory behind it, and how you can use some very basic exercises in your own designs to put these principles into practice.
Information Architecture - Tasks & Tools for Web DesignersDennis Deacon
We may not realize we're doing it, but Information Architecture is being performed transparently as part of our web projects.This presentation highlights the key aspects of this trade and provides some best practices.
There’s a digital design methodology gaining steam that you've likely never heard of, but that could make a big difference in your API design being clean, intuitive, and effortlessly usable for devs who use it. It’s called object-oriented user experience (OOUX).
OOUX is a design power tool that helps us define usable, consistent products that naturally align with end users’ mental models. Similar to its namesake, object-oriented programming, it asks us to define the objects in the real-world problem domain and design the information and relationships in each object before designing how the user might manipulate them. The highly structured nature of OOUX means it directly contributes to clean data modeling and highly portable systems that translate well to exposure via API. It's a powerful tool and it pays dividends fast.
In this session, you’ll get a high-level overview of what OOUX is and why it’s a game-changer, a discussion of the parallels and complementary concerns between OOUX and API design, and an idea of how API design planning could be represented in an OOUX data model.
Presentation originally given at THAT Conference 2021
This is the support deck for an introductory class I made for Junior Designers, Developers, Product and Project Managers to introduce them to the proper way to use wireframes.
I did this class already multiple times at General Assembly (London, UK), TechLab (Santa Clara, CA) and internally in my consulting job.
It's updated to OmniGraffle 6.
Same presentation, with Keynote:
http://www.slideshare.net/folletto/introduction-to-building-wireframes-with-keynote
Introductory overview of Skunk Works' history and the product development culture and engineering environment that resulted from Kelly’s fundamental confidence and belief in his engineers
We’ve all worked at places where there’s never enough time to make sure that things are operationally done the “right way”—bills need to get paid, client or product/project work needs to get done and takes priority, and hey, everyone deserves to have a life, too. There is light at the end of this tunnel! Several companies, including Atari, Ford, Microsoft and Google, have pulled off some great things by taking advantage of skunkworks teams and projects. I’ve been fortunate enough to see some successes with those teams and projects, as well, and will share them so you can see how to apply the approach(es) to your own practice.
Way back in the 1940s, Kelly Johnson and his team of mighty skunks used their Skunkworks process to design—and build—a prototype jet fighter in 143 days. Kelly established 14 Rules and Practices for Skunkworks projects in order to help articulate the most effective way for his team to be successful in the projects that they worked on. Not only can we learn from Kelly’s rules and adapt them to our current methods of working, we can also create our own skunkworks teams and projects to ensure that the Cobbler’s kids—the operational areas of our design practices—get some shoes put on their feet. And the results might just smell pretty good, if you’re patient enough.
Designing Great Dashboards for SaaS and Enterprise ApplicationsDesign for Context
Presentation by Lisa Battle at the UXPA2016 conference in Seattle, WA, on June 3, 2016.
Many SaaS and enterprise applications today provide dashboards giving users an overview of how their business is performing and summarizing the work that needs to be done. Dashboards present a great opportunity to improve user experience by providing quick answers to users’ common questions, but they are also full of potential pitfalls for design. As UX design consultants, we are frequently asked to design (or redesign) dashboards for applications, and through that experience we have established best practices for dashboard design. We will discuss our approach to ensuring a good user experience for dashboards, focusing on 8 principles of UX design that are particularly relevant and illustrating them with real project examples.
Designing Great Dashboards for SaaS and Enterprise ApplicationsUXPA International
Many SaaS and enterprise applications today provide dashboards giving users an overview of how their business is performing and summarizing the work that needs to be done. Dashboards present a great opportunity to improve user experience by providing quick answers to users’ common questions, but they are also full of potential pitfalls for design. As UX design consultants, we are frequently asked to design (or redesign) dashboards for applications, and through that experience we have established best practices for dashboard design. We will discuss our approach to ensuring a good user experience for dashboards, focusing on 9 principles of UX design that are particularly relevant and illustrating them with real project examples.
Congratulations, your data is up and running in a graph database! This is the first step of many to unlocking the potential in your data. It’s easy to get mired in the complexities of graph technology and forget that real users, mere mortals, will need to use this information to inform mission critical tasks. To get the value out of your graph investment, you’ll need to provide an experience that enables users to explore and visualize your graph data in meaningful ways.
In this talk, we’ll take a hands on approach to applying user-centered strategies and leveraging the latest UI tools to rapidly create great experiences with graph data. Topics will include network analysis queries with Cypher and APOC, tailoring experiences to the intended audience and data, determining the the right visualization for the job and cutting through the clutter on choosing the right visualization tools.
DataStax | Meaningful User Experience with Graph Data (Chris Lacava, Expero) ...DataStax
Congratulations, your data is up and running in a graph database! This is the first step of many to unlocking the potential in your data. It’s easy to get mired in the complexities of graph technology and forget that real users, mere mortals, will need to use this information to inform mission critical tasks. To get the value out of your graph investment, you’ll need to provide an experience that enables users to explore and visualize your graph data in meaningful ways. In this talk we’ll take a hands on approach to applying user-centered strategies and leveraging the latest UI tools to rapidly create great experiences with graph data. Topics will include:
Tailoring experiences to the intended audience and data
Interacting with complex data shouldn’t be complicated for users. The key is to understand your users and build a solution that targets them.
Zeroing in on user goals and creating a solution that targets them in a fast, lightweight and iterative way
Using live data and rapid prototyping to inform your navigation, visualization selections and overall design
Determining the the right visualization for the job
Just because you can display almost anything doesn’t mean you should. Choosing the right visualizations to achieve specific goals is a key factor in unlocking the usefulness of graph. We’ll demonstrate how to match the right visualization against user needs.
When is it appropriate to break out of the standard node view and visualize graph data in another context like a geospatial map?
How do I determine the dominant dimensions to filter a node chart?
What is the simplest, most efficient way to traverse time with large data sets?
Do I need to visually expose the graph at all?
Cutting through the clutter on choosing the right visualization tools
Once you’ve got your goals set, how do you make it happen? Will it perform at scale? We’ll demonstrate example use cases with sample graph data and some of these tools to highlight practical uses.
UX Research within an Agile Design and Development Sprint CycleUXPA International
Want to know how to deliver high-value, strategic research insights within a lean sprint process? Learn a quick, useful, and inexpensive process for incorporating user research & usability into Agile Design & Development sprint cycles. We will share a case study that demonstrates how it works and how we work together (research + UX design + dev).
Some of the topics we'll cover:
User Research on a slim budget & tight timeline
Planning research while still designing (what, when, how)
Rapid prototyping to support usability testing
The Post-Testing debrief (meeting with core team to discuss observations & agree on next steps for design and development)
Design iteration based on testing observations (not based on a lengthy expensive report)
Which tools do you use for project management, design, market analysis and conversion optimization? THoMer Eva opens our digital toolkit and shares 8 instruments we apply on a daily basis.
Data lineage is a regulatory and internal requirement with potential to deliver significant operational and business benefits, but financial institutions can find it difficult to implement and complex to maintain as systems and regulatory requirements themselves, change quickly. The importance of understanding where the true source of the data is coming from, where the data flows to and what has changed cannot be overstated. The webinar defines data lineage and discuss implementation through the eyes of those that have implemented and sustained successful lineage solutions with significant benefits.
Listen to the webinar to find out about:
- Data management for data lineage
- Winning buy-in for projects
- Best practice implementation
- Operational and business benefits
- Expert practitioner advice
Going Responsive with Google Analytics - EdUiNewCity
Responsive design can get all of your site content on mobile devices, but without some tweaking, it can wreak havoc on your analytics. Learn to set up profiles that will not only preserve your current results but give you new insights about how people use your site in different contexts.
Implementing Consistent Experiences in Modern SharePoint sites #spshouKanwal Khipple
SharePoint Modern development patterns continue to evolve. Site Designs and Site Scripts are the latest in assisting you to automate the provisioning of new or existing modern SharePoint sites using customizations that you create. This session will go into describing how you can use site designs and site scripts to provide custom configurations to apply when new sites are created as well as how to apply them to existing sites as well. We will cover the latest branding capabilities as well as show you practical script actions that you can use to configure site settings, lists, pages, and other UI elements to create consistent sites.
No beating around the bush here, just 27 kickass growth hacking tools with a complete breakdown of why we like each one and how much they cost.
I want to give you exactly the information you need, and none of the fluff you don't.
These 27 growth hacking tools are split into six sections:
Email Marketing, Social Media, Marketing Automation, Browser Plugins, Sales Funnel and Miscellaneous Favorites
What do companies such as Slack and Porter Airlines have in common? Not only do they have well-designed interfaces that get your users’ job done, but also content that is clear, intentional, and serves a unique purpose. In an age where great design is won or lost at the user experience (UX) level, how can we ensure that we deliver websites or apps that are not just pretty but also purposeful in both design and content?
In this session, we will be using a UX research technique called “Contextual Personas” to kickstart your content design process. We will be mashing up the time-honoured techniques of persona creation – such as user interviews, contextual inquiry, etc. – with strategic foresight methods to identify some user types and content strategies for your target audience. By identifying users across their most critical and uncertain needs, we will be able to pinpoint what exactly do they want out of our product or service and how we can achieve their goals through our copy, through our design, and throughout their user journey.
Don’t let “lorem ipsum” hold you back! Let contextual personas deliver the insight you need to build digital products that users love.
(Presented at WordCamp Toronto, August 7, 2016)
Real Talk: Proving Value through a Scrappy Playbook (Dianne Que at DesignOps ...Rosenfeld Media
Dianne Que: “Real Talk: Proving Value through a Scrappy Playbook”
DesignOps Summit 2019 • October 23-24, 2019 • New York, NY, USA
http://www.designopssummit.com
Design is Not the Frosting on the Scaled Agile Layer Cake (Erin Hauber at Des...Rosenfeld Media
Erin Hauber: “Design is Not the Frosting on the Scaled Agile Layer Cake”
DesignOps Summit 2019 • October 23-24, 2019 • New York, NY, USA
http://www.designopssummit.com
Setting the Table for Dynamic Change (Jacqui Frey and Alison Rand at DesignOp...Rosenfeld Media
Jacqui Frey and Alison Rand: “Setting the Table for Dynamic Change”
DesignOps Summit 2019 • October 23-24, 2019 • New York, NY, USA
http://www.designopssummit.com
Transforming Strategic Research Capacity through Democratization (Marjorie St...Rosenfeld Media
Marjorie Stainback and Kelsey Kingman: “Transforming Strategic Research Capacity through Democratization”
DesignOps Summit 2019 • October 23-24, 2019 • New York, NY, USA
http://www.designopssummit.com
Lessons From the DesignOps Journey of the World’s Largest Travel Site (Eniola...Rosenfeld Media
Eniola Oluwole: “Lessons From the DesignOps Journey of the World’s Largest Travel Site”
DesignOps Summit 2019 • October 23-24, 2019 • New York, NY, USA
http://www.designopssummit.com
DesignOps in Wonderland (Carla Casariego and Sarah Spencer at DesignOps Summi...Rosenfeld Media
Carla Casariego and Sarah Spencer: “DesignOps in Wonderland”
DesignOps Summit 2019 • October 23-24, 2019 • New York, NY, USA
http://www.designopssummit.com
Debunking the Myths of Cross-Disciplinary Collaboration (Alastair Simpson at ...Rosenfeld Media
Alastair Simpson: “Debunking the Myths of Cross-Disciplinary Collaboration”
DesignOps Summit 2019 • October 23-24, 2019 • New York, NY, USA
http://www.designopssummit.com
Distributed Design Operations Management (Jilanna Wilson at DesignOps Summit ...Rosenfeld Media
Jilanna Wilson: “Distributed Design Operations Management”
DesignOps Summit 2019 • October 23-24, 2019 • New York, NY, USA
http://www.designopssummit.com
A Deep Dive Into Value and Outcomes (Kristin Skinner and Kamdyn Moore at Desi...Rosenfeld Media
Kristin Skinner and Kamdyn Moore: “A Deep Dive Into Value and Outcomes”
DesignOps Summit 2019 • October 23-24, 2019 • New York, NY, USA
http://www.designopssummit.com
Jazz Improvisation as a Model for Team Collaboration (Jim Kalbach at Enterpri...Rosenfeld Media
Jim Kalbach: "Jazz Improvisation as a Model for Team Collaboration"
Enterprise Experience 2019 • June 3-4, 2019 • San Francisco, CA, USA
http://www.enterpriseexperience.net
We’ve Never Done This Before (Nova Wehman-Brown and Ken Hoffmann at Enterpris...Rosenfeld Media
Nova Wehman-Brown and Ken Hoffmann: "We’ve Never Done This Before"
Enterprise Experience 2019 • June 3-4, 2019 • San Francisco, CA, USA
http://www.enterpriseexperience.net
How UX Research Hit It Big in Las Vegas (Melissa Schmidt and Adam Menter at E...Rosenfeld Media
Melissa Schmidt and Adam Menter: "How UX Research Hit It Big in Las Vegas"
Enterprise Experience 2019 • June 3-4, 2019 • San Francisco, CA, USA
http://www.enterpriseexperience.net
Enterprise UX Storytelling Sessions (Dan Willis et al. at Enterprise Experien...Rosenfeld Media
Dan Willis et al.: "Enterprise UX Storytelling Sessions"
Enterprise Experience 2019 • June 3-4, 2019 • San Francisco, CA, USA
http://www.enterpriseexperience.net
Expert Accessory Dwelling Unit (ADU) Drafting ServicesResDraft
Whether you’re looking to create a guest house, a rental unit, or a private retreat, our experienced team will design a space that complements your existing home and maximizes your investment. We provide personalized, comprehensive expert accessory dwelling unit (ADU)drafting solutions tailored to your needs, ensuring a seamless process from concept to completion.
White wonder, Work developed by Eva TschoppMansi Shah
White Wonder by Eva Tschopp
A tale about our culture around the use of fertilizers and pesticides visiting small farms around Ahmedabad in Matar and Shilaj.
You could be a professional graphic designer and still make mistakes. There is always the possibility of human error. On the other hand if you’re not a designer, the chances of making some common graphic design mistakes are even higher. Because you don’t know what you don’t know. That’s where this blog comes in. To make your job easier and help you create better designs, we have put together a list of common graphic design mistakes that you need to avoid.
Between Filth and Fortune- Urban Cattle Foraging Realities by Devi S Nair, An...Mansi Shah
This study examines cattle rearing in urban and rural settings, focusing on milk production and consumption. By exploring a case in Ahmedabad, it highlights the challenges and processes in dairy farming across different environments, emphasising the need for sustainable practices and the essential role of milk in daily consumption.
Unleash Your Inner Demon with the "Let's Summon Demons" T-Shirt. Calling all fans of dark humor and edgy fashion! The "Let's Summon Demons" t-shirt is a unique way to express yourself and turn heads.
https://dribbble.com/shots/24253051-Let-s-Summon-Demons-Shirt
Dive into the innovative world of smart garages with our insightful presentation, "Exploring the Future of Smart Garages." This comprehensive guide covers the latest advancements in garage technology, including automated systems, smart security features, energy efficiency solutions, and seamless integration with smart home ecosystems. Learn how these technologies are transforming traditional garages into high-tech, efficient spaces that enhance convenience, safety, and sustainability.
Ideal for homeowners, tech enthusiasts, and industry professionals, this presentation provides valuable insights into the trends, benefits, and future developments in smart garage technology. Stay ahead of the curve with our expert analysis and practical tips on implementing smart garage solutions.
16. ATypography Color Iconography
VIEW
The Universe!
It’s the biggest place.
THE SOLAR SYSTEM
A slightly smaller place.
Space
UNIT: Space
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
17. ATypography Color Iconography
VIEW
The Universe!
It’s the biggest place.
THE SOLAR SYSTEM
A slightly smaller place.
EDIT
Space
UNIT: Space
My Earth!
It’s my biggest place.
MySpace
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
23. Framing a Design System’s Roadmap bit.ly/8s-system-roadmap
What We Could Do
What We Will Do, By When
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
28. CRITERIA
A DESIGN SYSTEM MISSION
Create efficient tooling
& collabora/ve connecBons
to support scaling & shipping
cohesive, high-quality experiences
PARTS
PEOPLE
PRODUCTS
WHY
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
30. A DESIGN SYSTEM’S REACH
∞ A World’s PlaUorm
100 An Enterprise’s Language
10 A PorUolio’s Guide
1 A Team’s Playbook
A Design System’s Reach bit.ly/8s-system-reach
http://foundation.zurb.comhttp://www.google.com/desharmony.intuit.comhttp://ux.mailchimp.com/patt
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
42. The demo convinced
anyone in 1 minute,
leaving me 59 minutes to
dig into heTier topics
@livlab
“
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
51. InformaAon architecture
InteracAon design
User experience
Visual design
WriAng
Front-end dev
Design research
Content strategy
Systems engineering
Product management
etc…
DESIGN LANGUAGE
Color
Palettes, by category
Contrast
Meaning
Swatches
UI ELEMENTS
Paragraph
Lead paragraph
Block quote
Headers (H1 - H6)
Lists
Links
Code
Typography
Hierarchy
Weights / types
Web fonts
Baseline grid
Buttons
Primary
Secondary
Button groups
Menu buttons
Split buttons
FAB (floating action)
Iconography
Pictograms
Illustration
Icon fonts
Alignment
Form controls
Text
Variants (email, etc)
Text area
Radio
Checkbox
Select
Motion
Principles
Timing
Types
Transitions
Form controls, cont’d
File upload
Labels
Floating labels
Microcopy
Required
Validation
Space
Units / measurments
Metrics and keylines
Structure
Photography
Divider / rule
Switch
Slider
Image
Block
Full bleed
Inline with positions
UI COMPONENTS
Action bar/sheet
Back to top
Badges
Breadcrumbs
Calendar picker
Caption
Cards
Chat (live)
Code block
Comments
Contact us
Cookie notification
Data tables
Dialog
Drawer/accordion
Filters
Footer
Footnotes
Header
Hero billboard
Hero carousel
Legend
Loading / spinner
Local navigation
Maps
Menu
Messaging
Toast
Block
Inline error
Modal
Nav Megamenu
Pagination
Progress bar
Pull quote
Ratings
Reviews
Rich text editor
Search
Sidebar
Site/App navigation
Social networking
Status (alpha, beta,...)
Tabs
Tags / chips / pills
Thumbnails / #-ups
Tips / tutorial
Toolbar
Tooltips
Video & media
UI PATTERNS
Authentication
Create account
Database connection
Form structure
Launch
EDITORIAL
Voice & tone
Writing for the web
Word list
Capitalization
Punctuation
DOWNLOADS
Templates (PSD,...)
Swatch palettes
Fonts
Icons
Code
Permissions
Purchase/checkout
Settings
Site / app structure
Swipe to refresh
BRANDING
Identity
Logo(s)
Tagline(s)
Partnerships
Themes
GETTING INVOLVED
Request New Parts
Give Feedback
Request Audit
Present at a Share
Contribute
PAGE TEMPLATES
Home
Category
Product
Dashboard
Article
RESEARCH & USERS
User needs
Personas
Research techniques
Surveys
A/B, multivar. testing
ABOUT THE PROGRAM
Home page
Principles / pillars
Getting started
FAQ
Version history
Search results
Contact us
Getting started
Discussion
Gallery
PRACTICES
Accessibility
Prototyping
Performance
SEO
Design thinking
ABOUT THE TEAM
Team
Recruiting / jobs
LAYOUT SYSTEMS
Grids for sites
Grids for apps
Paneling/transitions
Responsive/breakpoints
Screen sizes
CODING
Style
Browsers & devices
Environments
Prog. enhancement
Version control
UTILITIES
Mixins
Helpers
Customize
Variables / tokens
YOUR NAME
OTHER?
DATEPARTS
#3. ENSURE SKILLS REPRESENT PARTS
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
52. MODEL 3: FEDERATED
Team Models for Scaling a Design System bit.ly/8s-system-team-models
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
53. The Salesforce Team Model for Scaling a Design System bit.ly/sf-system-team-model
AT SALESFORCE, A “CYCLICAL” TEAM MODEL
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
55. @CAP’S SLIDING SCALE OF GIVING A F@#$
0 2 4 6 8 10
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
56. @CAP’S SLIDING SCALE OF GIVING A F@#$
Hold on a second. I’m like a two-out-of-
ten on this. How strongly do you feel?
I’m probably a six-out-of-ten.
Cool, then let’s do it your way.
0 2 4 6 8 10
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
58. #5. DESIGNATE “GO TO”S, NOT DECIDERS
C
Content
I
Interaction
V
Visual
X
user eXperience
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
59. #6. MIX DOERS WITH DELEGATORS
D = Director
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
61. Alignment work wasn't enjoyable.
This Project Rocked! That Project Sucked! bit.ly/8s-projects-rocked-sucked
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
62. Familiar role as…
• Maker (design & dev)
• Writer
• Collaborator
• Reviewer
#7. EMBRACE NEW RESPONSIBILITIES
New idenAty as…
• Product Manager
• Editor-in-chief
• Seller
• Evangelist
• Connector
• Aligner
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
64. First things first: You must have total
support from the top.
[A Google-wide design iniAaAve] required the vision
of a CEO who could rally the enAre company to
make it happen.
@jonwiley
“
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016
65. A style guide is an ARTIFACT of design process.
A design system is a living, funded PRODUCT
with a roadmap & backlog, serving an ecosystem.
A Design System isn’t a Project. It’s a Product, Serving Products. bit.ly/8s-system-is-product
Enterprise UX.Beyond the Toolkit.Nathan Curtis.key - June 6, 2016