Setka Editor was created by developers who’ve spent years building different kinds of online publications. They know the real needs of editors and designers, and have wired them into the tool, making sure the interface is seamless and easy to use for those without a background in design. To create something really outstanding, you might want to learn some tricks.
We asked Accent art director Dmitry Raspopov to share the tricks he used designing one of our recent posts — “Getting your customers to cross the river: Chris Lema Shares the 5 Stages of Creating a Compelling Business Narrative”.
01.
Choosing the right layout grid for your idea
Here’s the one we’ve picked for the interview with Chris Lema:
- 6 columns (940px)
- 20px gutter, 40px min margins
This grid works best for wide posts, leaving enough space for custom illustrations.
You can learn more about layout grid and grids here.
02.
Using full width illustrations
As you’re using Setka Editor to edit and design posts, all the content you add lives inside the post. The background image or the images used as post illustrations cannot go beyond the width of the post itself. The post width is defined by the WordPress theme you’re using. If the post width in your theme is constrained by sidebars or other theme settings, you can change it to 100%-width for any given post by installing a dedicated plugin – Full width Page Templates, or manually editing the CSS files of your WordPress theme. After you implement these adjustments, you’ll be able to use full screen images.
To learn more about image settings, visit our Help Center.
03.
Use our Smart quote tool
The Smart quote tool transforms plain text into a quote. To apply it, choose the Smart design feature in Setka Editor, select any sentence or paragraph you want to make into a quote and click on the quote button on the left. The selected text will get visually highlighted and will stand out from the rest of the content. To learn more about Smart design tools, click here.
04.
Highlighting key points with specially designed cards
To make sure that the readers get the key message of the post and find it fun and easy to read, we decided to highlight some of Chris’ advice with special cards. The design of the cards allows you to use custom backgrounds. This supports the point you want to get across, and helps to make the post more visually rich.
We loved the card design with the background we’ve used, and saved it as a component, so we can quickly add a similar card to other posts.
You can learn more about designing components in our Help Center.
05.
Matching the background with the colors of the illustrations
We loved Chris’ river metaphor and further highlighted it by adding the blue background to one of the chapters of the post. You can read more about backgrounds here.
06.
Adding animation
You can use Setka Editor to animate texts, images and infographics. You can apply animation to a paragraph, image or the whole grid. You can also set different directions (from left to right, upwards/downwards), zoom (in and out) and rotation. To make the post experience more fun, we decided to animate some of the additional blocks.
07.
Saving the post as a template
You may want to publish posts with an identical structure and similar design elements as those you’ve created before. Similar to components, post templates save your time when creating new posts.
To check out the result, visit Accent, our publication about digital media, journalism, and design.
Visit Accent
Give Setka Editor a try
Get a demo from our Customer Success team or try Setka Editor for two weeks, free.
