SECONDARY LABELS

Last Update: 05/30/2018

GENERAL RULES

Use only in the vertical's homes like Noticias, Deportes .... . It doesn’t apply for univision.com
The label should not exceed two words
Use the label in no more than two content cards within a widget
Use only one “secondary label” in the content card
If the Authentication, “En vivo” or “Liveblog” labels exist in the content card, the secondary label will not appear.

DOWNLOAD SKETCH FILE HERE 🎨

CASE 1 : TEXT LABEL + ICON

SMALL THUMBNAILS

No author
Place label above the headline

MEDIUM THUMBNAILS

Place label on the top left corner of the image, with a 10px top and left margin

LARGE THUMBNAILS

Place label above the headline.
Leave 8px bottom margin

EXAMPLE: High impact current version - with Frontend improvements

EXAMPLE: High impact new version

Mockups with user cases

MOBILE: https://univision.invisionapp.com/share/7AJTVQ8M6SF

INSPECTOR URL: https://univision.invisionapp.com/d/main/#/console/12863211/299945311/inspect

DESKTOP: http://univision.invisionapp.com/share/4JJTVW1NHAC

INSPECTOR URL: https://univision.invisionapp.com/d/main/#/console/12862898/299945204/inspect

CASE 3: THEMING VERSION

📌 Label container, inherits the section color theming as the background color

SMALL THUMBNAILS

No author
Place label above the headline

MEDIUM THUMBNAILS

Place label on the top left corner of the image, with a 10px top and left margin

LARGE THUMBNAILS

Place label above the headline.
Leave 8px bottom margin

High impact current version - with Frontend improvements

High impact new version

Mockups with user cases

Mobile ( Deportes case)

MOCKUPS:

DEPORTES: https://univision.invisionapp.com/share/GWJTW6IQE9B

NOTICIAS: https://univision.invisionapp.com/share/3XJTW8CMKNE

ENTRETENIMIENTO: https://univision.invisionapp.com/share/B4JTW9SESQZ

INSPECTOR URLS

DEPORTES https://univision.invisionapp.com/d/main/#/console/12863211/299966928/inspect

NOTICIAS https://univision.invisionapp.com/d/main/#/console/12863211/299966926/inspect

ENTRETENIMIENTO https://univision.invisionapp.com/d/main/#/console/12863211/299966927/inspect

Desktop ( Deportes case)

DESKTOP MOCKUPS:

DEPORTES: https://univision.invisionapp.com/share/94JTWMEVNE3

ENTRETENIMIENTO: https://univision.invisionapp.com/share/6VJTWNQWNSU

NOTICIAS: https://univision.invisionapp.com/share/CBJTWP66S3Y

DESKTOP INSPECTOR URL:

DEPORTES: https://univision.invisionapp.com/d/main/#/console/12862898/299968294/inspect

ENTRETENIMIENTO: https://univision.invisionapp.com/d/main/#/console/12862898/299968293/inspect

NOTICIAS: https://univision.invisionapp.com/d/main/#/console/12862898/299968292/inspect

Report abuse