Eight Tips to Streamline Your Design Process with Showit

When you are starting a new design on Showit, there’s so much to do! When I first started designing a client site on Showit, I felt overwhelmed. By the end of the project, I realized there were things I could have done differently.

I suspect you’ve already watched a ton of tutorials, but let me show you how I approach design on Showit.

Set Up Typography and Colors First

The first things to change in your design are fonts and colors. If you’re starting from scratch with one of Showit’s default designs, like “Simple,” you’ll want to think through your typography and colors before setting things up in Showit.

You can upload as many custom fonts to Showit as you like, but keep only the ones you will use in the design. Once you set the defaults (h1, h2, h3, and paragraph font), use these defaults as much as possible throughout your design.

A similar approach applies to colors. Set up your palette from dark (darker shades) to light (lighter colors) to maintain continuity with other Showit designs. The idea is to use all default colors as much as possible throughout the design.

Create an Archive Page with Layouts

I like to have an archive page that I use as a playground to keep all the layouts I create and might reuse in the future. This is especially useful if you are using long landing pages in your design. It saves a lot of time! Plus, sometimes you want to delete a particular section from the design but keep it for future use somewhere. You can easily unpublish the page, so don’t worry about someone seeing it!

Organize Headers and Footers in Canvas Sets

Think through the headers and footers you will use in the design in advance. Create or modify them and organize them using the Canvas Sets feature. When you create new pages, you won’t have to do the work of manually copying and pasting the canvases across multiple pages.

After setting up colors and fonts, create all the pages you need and organize them in the menus. Canvas sets help do this quicker and stay more organized.

Use the Design Grid and the Snap-to-Grid Feature

Activate the layout grids and snap-to-grid feature to align your elements precisely. Grids in Showit help your text boxes, images, and other elements snap to guidelines or other elements, ensuring a tidy layout. If you’d like to use a different layout grid in Showit, not the one supplied automatically, here on Instagram I have a short tutorial on how to use just any other custom layout grid.

Design the Mobile Layout as You Go (Don’t Save It for the Future)

Ideally, you create your desktop and mobile layouts side by side. If your screen is too small, you can zoom out in your browser so that you can see more of your design.

Let’s say I am creating a design that uses repeating elements, for instance, cards that I intend to duplicate multiple times. I will design the desktop and mobile and then duplicate the card that already has a mobile version. That way I don’t have to rearrange elements and reapply styles on mobile. Fewer clicks!

Use the split desktop and mobile element feature to set up different designs for each screen. The feature shows up as three vertical dots next to any design setting.

Use mobile assistance to fix the mobile version quickly, in case you mess it up.

Use Advanced Alignment Options

When you select multiple objects, new alignment options show up in the settings menu on the right and you can align objects to each other. If you select an object, you can realign it to canvas.

Learn Keyboard Shortcuts to Speed Up Your Process

One of my favorite keyboard shortcuts is the special paste. It allows you to copy/paste the format from one object to another or copy/paste the format on elements between Desktop and Mobile Design.

There are more helpful shortcuts that you can learn here. Learn them once and save time on clicking around!

When in Doubt, Consult the Designs from the Showit Design Library!

Showit comes with a vast internal design library. While you cannot use the majority of these designs without crediting the creator, you can use this library to look up certain things. For example, if setting up a blog seems confusing, simply import blog pages to your site and study them. Plus, any question you have is already answered in the Showit documentation – it’s the best place to seek answers before you write in forums and contact support.