Marvel App

There is nothing in Zendesk customization that Lotus Themes could not do

Zendesk Guide for Marvel App

About the Company

Marvel is the collaborative platform for wireframing, design, prototyping and developer handoff. It puts the power of design in everyone's hands and provides everything you need in one place to bring ideas to life.

Challenges

Marvel’s team came across our premium themes which they liked, but their additional requirement for Zendesk customization was to display embedded Wistia/YouTube videos on the homepage of their knowledge base. They wanted to put videos front and center of the theme.

Also, Marvel liked Braden and Mink and wanted to mix some elements of these Zendesk templates. In particular, they desired to have some components from Mink on the homepage and keep the article layout of Braden.

They also provided us with a prototype for Zendesk customization, which isn’t surprising at all for a powerful and easy-to-use prototype tool like Marvel App :)

Solution

Phase 1

We took Braden as a basis for Zendesk customization, realized its potential regarding additional formatting components that are included in all our premium themes and branded it to match Marvel’s style guide. We decided to start with basic changes in the template and keep the spacing and layout so that we could make additional changes after Marvel’s team tested the demo Help Center.

We kept a sticky header which is part of the Braden template for Zendesk Guide, removed the ‘Sign in’ button and added the third custom block with a hover effect like all the other blocks in this theme. We also renamed ‘Promoted articles’ to ‘Selected articles’ and added ‘Still have a question’ block to all pages. As for the footer, we kept the default Braden one. To help Marvel display notifications on their Help Center, we suggested using our alert extension for Zendesk.

The article page also has some changes: we removed the author, date, comments, and ‘Recently viewed articles’. Moreover, we added the table of contents extension for Zendesk to the right to allow end-users to jump to the relevant section of the article in a moment without having to scroll the page up and down.  

 

Phase 2

After the first round of revisions, Marvel provided us with a list of changes they wanted to add to the existing custom theme for their Zendesk Guide. Their wish was to make blue links in 'Selected articles' black and make them change to blue on hover. Also, they would like to copy this style (black, blue on hover) for all the links in ‘Articles in this section’ and categories. Additionally, we added an underline under the h1 and h2 titles. Finally, we made the callout edges rounded.

There were some issues with the placement of Table of Contents and ‘Articles in this section’, so we recommended keeping the former on the right and the latter at the bottom. Mobile version features Table of Contents as an accordion menu at the top of the article by default in Braden.

Zendesk Guide for Marvel App before

Before

Zendesk Guide for Marvel App after

After

Video tutorials

One of the main Marvel’s requirements for Zendesk customization was related to video tutorials. We added them to the homepage under the custom blocks. All video tutorials have short descriptions and open in a lightbox.

 

Results

After we completed Zendesk customization, Marvel installed the custom theme on their Help Center successfully on their own, and since then their users and staff have been enjoying the new great experience.

 Zendesk Guide customization for Marvel App

 

“Thanks! Looks great now. You've been super helpful!”

Murat M.

 

Would you like to add something to our Zendesk premium theme but not sure if it is feasible?

Contact us

How to build a help center capable of reducing tickets?
Read the white paper
We use cookies to provide you with a better service and for promotional purposes. By continuing to use this site you consent to our use of cookies as described in our Privacy & Cookie Policy .
Thank you!

We’ll get back to you within 24 hours.

In the meantime, you may look at the examples of Zendesk help centers we customized.

Bonus: We’ve emailed you “Zendesk Help Center Best Practices from CX Leaders”

Get a Personalized Solution for Your Help Center

Answer 7 questions and get an exact quote. It will take 2-3 minutes, and you'll get a custom help center solution that solves your business problems.

Bonus: Get a compilation of Help Center Best Practices from CX Leaders

What is your Help Center URL, if you have one?

Where can we find your website? *

Add a link to your mockup if you have it.

What problems do you want to solve with the help center?

The better you describe your current situation, the more personalized solution we’ll offer you.

What is important to you in this help center project?

Please describe what is important to you to make a decision (except the price).

Which of our themes would suit your brand best?

Choose as many themes as you like. You may skip the question if you aren’t sure.

What is your budget range for this project?

The higher the budget is, the more customized your help center can be. Lower budgets allow you to get more standard changes.

Enter your corporate email to get your personalized solution and quote

Email *
Name Phone number (optional)
Please submit recaptcha