We develop our brand visual identity design to ensure it stays relevant in the market and reflects the benefits and quality of our product. We are the creative partners for GitLab marketing. We create, conceptualize, and design high quality brand experiences.
Why we exist
As stewards of the GitLab brand, our goal is to educate and enable the wider organization with resources to effetively and honestly communicate what the company does to our internal and external audiences.
Where we're going
The GitLab Brand Design team will elevate the brand beyond the logo and visuals - positioning ourselves as experts in brand strategy and behavior (how the brand presents itself, how it's perceived, and what makes it authentic)
What we do
Create simple, effective, and intentional brand experiences by solving complex problems; defining the what, why, and how, resulting in a message that's easy to understand.
Please fill out one of these Issue Templates to request support. Please note, if these are not filled out we won't have the proper information for us to support your request.
The best way to get in contact with the Brand design team is to fill out one of the above issue templates with your request, or to:
In the past we have accommodated internal team logo requests, typically in the form of customized tanukis. As our company grows, this approach is not scalable for the Brand Design team. Additionally, altering the logo or using too many logos diminishes the integrity of our brand identity and dilutes our brand awareness. We understand the desire for teams within GitLab to have their own identity, but this should not be prioritized over the business value that comes from preserving our core branding. For this reason, all designs should complement and adhere to our brand guidelines.
If your team works on a larger initiative, please refer to our program lockup guidelines. These lockups should be used in conjunction with the GitLab logo and branding. If you are unsure if your program or initiative requires a lockup, please contact the Brand Design team.
To learn more about our Brand Guidelines, self-service resources and assets, and training materials, check out the Brand Resources handbook. Below you will find more details about working with our brand and creative materials.
In certain cases, the help of a third party agency or design partner may be brought in for a project. The following serves as criteria for when to outsource design:
Whenever a third party is brought in to support design, the work must be shared with the Brand Design team to ensure brand integrity and that we are working transparently with one another.
The GitLab brand has been a source of creative inspiration for team members and the wider community since its inception. In many cases, team members may find themselves creating spinoff art inspired by our values, software, and tanuki logo.
Artwork that draws inspiration from or is based on GitLab’s intellectual property (“Fanart”) is not always an accurate representation of our brand, product, and company, and may dilute our brand or infringe on our intellectual property rights. To protect our brand, GitLab team members must adhere to the following guidelines:
#brandSlack channel to discuss.
If you have questions, reach out to the Brand Design and Brand Strategy teams via the
#brand Slack channel.
We take a unique, creative approach specifically for TMRGs. In lieu of custom logos for the groups, our team delivers expressive art that can be used for swag and other requested collateral. TMRGs are an essential part of our company's culture, and we tailor the graphics to capture each group's essence and values. TMRG graphics should always be paired with the GitLab logo and incorporate the TMRG name in plain text. All art should lean on the foundations of our core branding.
We are all brand designers, brand champions, critically thinking problem solvers, strategists, and teammates – leveraging each others' strengths while growing our collective knowledge and expertise. We work by following GitLab’s values and using issues and epics to track our work.
The team should feel empowered to make the best decisions possible for the GitLab brand while seeking both structured and direct feedback from the team as often as possible. Adam and Luke are here to make final decisions as needed, but do not need to be the bottleneck of progress.
#marketing-designslack channel. (3) Wednesday design hours call where we get feedback and collaborate on topics that need to be addressed.
designissue labels to show up on our team’s triage board. Adam and Luke triage work at the beginning of the week, and team members are able to assign work to themselves, too. We use issue weights (1 weight = approx. 4 hours of work) to measure bandwidth and milestones to track capacity for each week. Everyone can see their work for the week by looking at their individual issue board.
#brand-design-teamslack channel. Drafts are typically shared async with the stakeholder using the design tab in issues or as a screenshot in comments.
We upload and pull work locally from the corporate-marketing repository. For confidential projects, we store files in the team Google Drive.
_artwork) and another folder for your exported files (ie: png, exports, pdf, etc.).
corporate-marketingrepository to your machine. For your day-to-day work, here are the typical git commands for pulling and pushing work, in the order of which they should be used:
cd corporate-marketing- this command only needs to be used once upon opening the Terminal app. The
cdcommand may need to be done multiple times, followed by the parent folder name where you’ve stored the repository on your device, until you get into the
git pull- this updates your local repository to mirror any changes made by the rest of the team; do this command before starting work or pushing any new work
git status- optional command; this provides a summary of all the changes you’ve made locally that need to be pushed back the repository
git checkout [insert file path
]- optional commnand; this can be used to remove any files you do not want to push to repository
git add .- use this command before pushing your work; it will add all the files you have made changes to
git commit -m “[insert description of changes]
”- include a message with a summary of your changes; this is viewable to everyone and provides context
git push origin master- this will push all your changes back to the repository, including the commit message to describe the changes
git pull --rebase, followed by,
git push origin master- use these two commands to reset if you receive an error when pushing
The Brand Design team mantains the Brand Guidelines on design.gitlab.com (Pajamas). For our team's purposes, we can make updates to the guidelines using Web IDE.
To get started, follow the workflow outlined below and check out our demo with the Product team.
Using Web IDE
Open Web IDE.
Our Brand Guideline pages are located in the
Contents folder and organized accordingly:
brand:This folder contains the Brand Guidelines Overview page.
brand-design:This contains pages related to design guidelines.
brand-logo:This contains pages relating to logo guidelines.
brandfolder is where all media will be stored that links back to the Brand Guidelines.
nav.json:This file dictates the structure reflected in the navigation bar on Pajamas.
Creating a new page
.mdextension to denote a new markdown page.
titleis how you want your name to display on the page.
pathis what is reflected in the URL path (this should match the file name of the page you made).
Note: Pajamas uses markdown and the heading styles match the handbook. Add content as you normally would.
Optimizing and uploading media
.svgformat is ideal because it scales with the page. Optimize your file before uploading by using SVGO.
.jpgwork well for graphics that contain images. Optimize your graphic before uploading.
.gifformat is not accepted.
Add media using
figures, which connect the visual with a caption. Here is the breakdown of their structure:
aria-label=This text can be the same as the
img class=This formats the image's display size.
img-50scales the width down to 50% of the page.
gl-p-5scales to the full width of the page.
src=This correspond's with the image's location. This should match the file name that corresponds with what you’ve uploaded to the
alt=This is alternate text that displays in the case that the media does not populate on the page; this should be more descriptive and unique from the
fig captionThis is the descriptive text displayed below the graphic.
Pushing your merge request
Smaller commits make collaboration easier.
Type:featurecovers most of the updates our team makes.
type:feature:Effort to deliver new features, feature changes & improvements.
type:maintenance:Up-keeping efforts & catch-up corrective improvements that are not Features nor Bugs.
type:bug:Defects in shipped code and fixes for those defects.
feat(BrandMotion): embed samples.
pushyour commit to a
new branch. Then select
create merge request.
review appto preview changes.