JORDAN'S LAB.

Currently testing icon and naming conventions of buttons

MEET OUR PEOPLE

Globe Ensemble – Headshot Bios

[HEADSHOT]
Nina Bowers
Actor

Executive Team – List Bios

Communications Director Mark Sullivan

Board of Trustees – List Bios (grouped)

Members of the Board
Alex Beard
David ButterDr Martin ClarkeNeil Constable, CEO

 

 

TEST SUBTITLE STYLING

Can I add heading 3?

Can I add Lead paragraph?

Can I add Small paragraph?

Can I add small caps?

Can I add hyperlink?

Can I add a button? 

Can I add an outline button?

Can I embed media? No because I cannot toggle between visual and text view – can this be added as an option in Subtitle areas?

can I add
a table ?

Can I align text?

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin quis lectus a ipsum facilisis sagittis at pretium eros. Praesent vitae lacinia elit. Cras sollicitudin, libero ac ultrices rhoncus, est odio aliquam sapien, gravida tincidunt felis ligula eu purus. Nullam finibus varius arcu, at fermentum orci sollicitudin at. Donec et semper odio, vitae interdum dui. Duis at pretium nibh, nec scelerisque elit. Ut sit amet turpis felis. Aliquam condimentum vestibulum ante, sed finibus lectus volutpat et. Nam odio urna, vulputate et tortor et, lobortis malesuada tortor.

Duis hendrerit risus risus, nec maximus lectus ullamcorper in. Quisque non eros faucibus, tempus nulla sed, bibendum massa. Phasellus accumsan turpis augue, sed convallis turpis tincidunt et. Curabitur eget tempor sem. Phasellus imperdiet risus ac sem hendrerit, posuere commodo urna placerat. Vivamus accumsan ante ultrices nunc aliquam, interdum varius mauris auctor. Quisque posuere dignissim libero nec eleifend. Integer facilisis eu erat ac sodales. Donec condimentum lectus dolor, ac semper nisl condimentum ac. Aenean sollicitudin massa vitae elit euismod interdum. Fusce pretium elit nec ex commodo molestie sed sed neque. Duis hendrerit augue felis, et laoreet lorem condimentum eget.

Accordion

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin quis lectus a ipsum facilisis sagittis at pretium eros. Praesent vitae lacinia elit. Cras sollicitudin, libero ac ultrices rhoncus, est odio aliquam sapien, gravida tincidunt felis ligula eu purus. Nullam finibus varius arcu, at fermentum orci sollicitudin at. Donec et semper odio, vitae interdum dui. Duis at pretium nibh, nec scelerisque elit. Ut sit amet turpis felis. Aliquam condimentum vestibulum ante, sed finibus lectus volutpat et. Nam odio urna, vulputate et tortor et, lobortis malesuada tortor.

I’m a resident of Southwark how can I get tickets?
Southwark residents can purchase tickets in person only from Shakespeare’s Globe box office at 10am on Saturday 29th June. Two forms of ID will be required to purchase tickets. 1 to prove your name and 1 to prove your address (e.g a credit card/debit card /driving license/passport/utility bill) Tickets cannot be purchased on behalf of other people unable to attend on Saturday 29th June. Tickets will only be sold to those 16 years and over. Please note there is a very limited number of tickets and we expect demand to outweigh availability. Any Southwark resident who is unable to purchase tickets on Saturday 29th June will be eligible to enter the ballot.

BUTTON & ICON NAMING CONVENTIONS

  • Write BUTTON TEXT in full caps

WHAT’S ON

FILTER EVENTS

CLEAR FILTERS

TNEW zones

12.30 PM

£10 – £20

TNEW progression buttons

CONTINUE SHOPPING

PROCEED TO CHECKOUT

ADD TO BASKET

(progression to Basket page therefore uses an arrow instead of the basket icon)

TNEW UPSELL buttons

ADD TO BASKET

(Can use the Basket icon as you remain on the same page)

REMOVE FROM BASKET

(Can use the Basket icon as you remain on the same page)

WHAT’S ON

Henry IV Part 2, or Falstaff

25 APRIL – 11 OCTOBER    GLOBE THEATRE

As King Henry IV lies dying and the rebels maintain their unrest, Falstaff, returned war-hero, and closest confidant of Prince Hal, is engaged to recruit for the King’s army.

Summer Theatre Season 2019

BOOK NOW      DISCOVER  MORE

 

EVENT PAGE BUTTONS

These mirror the style of the What’s On cards. The use of the chevron in this user journey indicates progress – should we continue this theme in TNEW with the rest of the checkout stages?

BOOK NOW

7.30 PM 

Access listings

Use brochure access symbols.

For the access performance listings can we use these:

SHOW DATES

HIDE DATES

IN PAGE NAV

Is it important to use the same type of arrows or chevrons for in page navigation – up/down/left/right scrolling? Currently we use arrows for up/down scrolling and chevrons for left/right scrolling. Are we ok to keep using the current symbols or should we think about updating for consistency?

See the two views of What’s On for chevron use:

  • https://www.shakespearesglobe.com/whats-on/#event scrolling listings
  • https://www.shakespearesglobe.com/whats-on/#day scrolling dates
  • Date select also uses arrows for in page scrolling of months and date ranges.

Below we’ve listed both suggested icons and icons we’ve seen used on the site:

BACK TO TOP

scroll down:

scroll left:

alt 1 scroll left:

alt 2 scroll left:

scroll right:

alt 1 scroll right:

alt 2 scroll right:

IN PAGE HIDE/REVEAL

SHOW

HIDE

Alternative hide/reveal:

MORE

LESS

Alternative drop down/up, icon weight depends on use case:

circle down:

circle up:

chevron down:

chevron up:

CARDS

Currently the default call to action for Cards is a More button with an arrow. Can we replace with a discover more button?

DISCOVER MORE

Beyond using cards for the default call to action, I can imagine use cases for linking to a specific type of media. We asked of this to be automated for linking to Blogs and Media posts (see card buttons below). But sometimes we’ll want a call to action on a card that links to a normal page with a specific type of content. E.g. the landing page for our podcast, where we’d like to use the Listen button, as detailed in the Blog cards below.

How can we facilitate this in the CMS? Is the answer to give us control over the call to action buttons generated by Cards? Or can you build in options for us to use?

I guess some of this will depend on how you want Blogs & Media listings to be generated, whether that’s manually or by using keywords/tags to generate feeds we can embed into pages?

SHOP CARDS

For use in displaying embedded shop items/listings in pages. Not sure how you envisage us adding these currently? Manual cards for now with Shopify integration later?

SHOP

BLOGS & MEDIA - CARDS & BUTTONS

Buttons for blog cards

Will we use Cards for showcasing relevant blog listings through tag or category listings and the archive blog homepage. For a good example pick a NG page and scroll down to see related blogs/articles load.

READ

SEE PHOTOS

WATCH

LISTEN

TREAT THYSELF

Button for videos

WATCH VIDEO

Button for photo galleries

VIEW PHOTOS

PHOTOS & VIDEOS

WHY I SHOULD READ VIRGINIA WOOLF?

Watch video

IGTV EMBED CODE TEST