All Things Open 2014 - Day 1 Wednesday, October 22nd, 2014 Robb Hamilton & Greg Sheremeta Web/UX Designers for Red Hat Design Using Bootstrap to Create a Common UI Across Products

1. Using Bootstrap
to create a common UI
across products
Robb Hamilton & Greg Sheremeta

2. “... created to promote design
commonality and improved
user experience across
enterprise IT products and
applications.”

3. PatternFly
Red Hat Common User Experience (RCUE)

5. HTML
CSS
JavaScript
icon font

6. Mark Otto Jacob Thonton Larry the bird

7. Jacob Thonton
Medium
Larry the bird
cut from the team
Mark Otto
Github

8. open
source

11. Why Bootstrap?

13. = +

14. Custom look and feel
Additional components
UX expertise

16. RCUE = +

20. [dev@puter]$ bower install patternfly

23. @border-radius-base: 4px; //Bootstrap
@border-radius-base: 1px; //PatternFly

24. @navbar-pf-border-color: #199dde; //PF blue
@navbar-pf-border-color: #cc0000; //RCUE red

32. And now Greg!

33. UI standards?

38. A pattern is a “general reusable
solution to a commonly occurring
problem within a given context”
http://en.wikipedia.org/wiki/Software_design_pattern

39. I CAN HAZ BITS?

42. "All problems in computer science
can be solved by another level of
indirection, except of course for
the problem of too many
indirections."
David Wheeler

43. + +

46. <b:well ui:field=”loginStatus” />

48. PatternFly RCUE

52. www.patternfly.org