TED HBR

7/28/2019 TED HBR

1/26

PATTERN LANGUAGE

REVERSE ENGINEERINGhttp://www.ted.com

http://www.hbr.org

7/28/2019 TED HBR

2/26

Design patternsTED

Navigation

Non-linear navigation

Hierarchical navigation -- newbie

Grid style repeat customer

Customization superuser

7/28/2019 TED HBR

3/26

Navigation

7/28/2019 TED HBR

4/26

Customization

7/28/2019 TED HBR

5/26

Footer

7/28/2019 TED HBR

6/26

Design patternsTED

Navigation





Visual framework

Limited color palette

Popular science language

Consistency in font

7/28/2019 TED HBR

7/26

Consistent, clean

7/28/2019 TED HBR

8/26

Design patternsTED

Navigation





Visual framework

Limited color palette


Consistency in font

Layers down to titled box

Engagement is rewarded with further detail

Inclusion

7/28/2019 TED HBR

9/26

Layered engagement

7/28/2019 TED HBR

10/26

Design patternsTED

Navigation Non-linear navigation




Visual framework Limited color palette


Consistency in font


Engagement is rewarded with further detail Inclusion

Designs are complementary Caters to different audiences

Emphasizing the grid

7/28/2019 TED HBR

11/26

Design patternsTED







Consistency in font


Engagement is rewarded with further detail Inclusion



Status displays: real-time

7/28/2019 TED HBR

12/26

Design patternsTED







Consistency in font

Layers down to titled box Engagement is rewarded with further detail

Inclusion




Active/engaging

7/28/2019 TED HBR

13/26

Design patternsTED







Consistency in font

Layers down to titled box Engagement is rewarded with further detail

Inclusion




Active/engaging

Emohasized

7/28/2019 TED HBR

14/26

Design patternsHBR

Navigation


Several search boxes, without guidance

Hierarchical navigation traditional, prominent

Grid style -- trying

Customization not available

7/28/2019 TED HBR

15/26

Traditional navigation

7/28/2019 TED HBR

16/26

Footer

7/28/2019 TED HBR

17/26

Design patternsHBR







Mixed vocabularies

Consistency in font 3-column design is not effective

carousel

trying to get to the grid

sponsorship is prominent

Cases page design is superior

7/28/2019 TED HBR

18/26

Frenetic visual framework

7/28/2019 TED HBR

19/26

Design patternsHBR







Mixed vocabularies

Consistency in font

3-column design is not effective carousel

trying to get to the grid sponsorship is prominent


Designs are not complementary Caters to different audiences

Emphasizing the hierarchy

7/28/2019 TED HBR

20/26

Design patternsHBR Navigation






Visual framework Limited color palette Mixed vocabularies

Consistency in font







No layers Mashup/jumble

Engagement is rewarded with upgrade opportunities access level

7/28/2019 TED HBR

21/26








Mixed vocabularies

Consistency in font





No layers Mashup/jumble Engagement is rewarded with upgrade opportunities

access level



Only engaging in terms of upgrading

7/28/2019 TED HBR

22/26

Upgrade

7/28/2019 TED HBR

23/26








Mixed vocabularies

Consistency in font





No layers Mashup/jumble Engagement is rewarded with upgrade opportunities

access level

The designs are not complementary caters to different audiences

emphasizing the hierarchy

Only engaging in terms of upgrading

Emohasized

7/28/2019 TED HBR

24/26

Attempted grid

7/28/2019 TED HBR

25/26

Oh yeah, BUY something

7/28/2019 TED HBR

26/26

community commerce

TED HBR

Documents

TED HBR