ViBrAM = Visual Brand Asset Management

Vibram is our in-house “Whitelabel” asset manager for our degree and minisite environments. “Whitelabeling” is when a product (website) is produced by a company (a school) that other companies (2U) rebrand to make it appear as if it’s made by the school. We try to match the school’s styles (fonts, colors, logos, etc.) as much as possible, and those styles are stored in Vibram.

All of our degree websites will have the same layout and structure, but you’ll notice the colors, logos, and fonts are all different. That’s because of Vibram!

The Creative team uses their in-house tool called GraphCMS to upload assets that are specific to each program (color theme, logos, fonts, etc.). GraphCMS then connects to Vibram to host these assets. We then can sync the Brand ID from Vibram into WordPress for each program to its respective website and all of the unique colors, logos, and fonts will populate. 

Here is some documentation on how Vibram is connected to our degree and minisite environments.
Noting that this documentation is managed by our Vibram Tech team & may not be up to date.

The best way to understand Vibram is to view it. Below are some screenshots from the BAY-UMT environment within Vibram, as well as screenshots from the live site showcasing the Vibram assets:

This is Vibram’s dashboard displaying the live style guide for the BAY-UMT environment.

This is a screenshot from the live site which shows all the fonts, heading styles, colors, and more are pulled in from the Vibram environment.

Back within Vibram’s dashboard for the BAY-UMT environment, we can see all the logo assets.

These two examples show Baylor’s “logo-1” that is pulled into the site header and “logo-footer” that’s pulled into the site footer.

The creative team will publish their changes on Vibram but these changes won’t be reflected on any of our degrees or minisites until the WordPress environment has synced (with the exception of logos which are visible without syncing). This sync will override all the creative assets within a WordPress environment, please be sure to work with your manager and team to confirm prior to publishing. 

Using this BAY-UMT example from above we can show how Vibram and our WordPress environments are linked and how to sync them when a change to the Vibram environment is made. 

All Vibram environments have a specific UUID associated to it. 

In this example, on the Vibram dashboard we can see Baylor’s is fac56e9d-18c0-4d0a-b165-0bc992781a00.

We can look at Baylor’s WordPress environment settings and see where to place that UUID. 

[Log into the BAY-UMT environment > Options > Vibram]

Here we can see that Baylor’s UUID matches and is already configured within the WP environment. If we want to sync any new Vibram changes, we can click Import New Settings. Once imported, you must also click Save settings.

Reach out to Creative Marketing Group(CMG) or post in #project-vibram