The design behind Scribe


The Layout

The key behind clear blog design is the layout. When designing Scribe we wanted the content to be as visible and readable as possible. The main page posts are divided by a space which helps you focus on a specific post and the rest doesn’t disturb you. Each post has its own box shadow that gets thicker when you mouse over the post, so you know which post you are about to open. The reason we have decided to go with box-shadow rather than simple border is that the effect on mouse over brings out the box and the transition effect is just smoother and prettier than any other.


The Options


First concepts of Scribe included colors, which still work in many designs, but since we were making an easy template, we wanted to go with easy coloring. And what is better and easier than simple black and white contrast? One of the greatest features of Scribe is a full color design customization, so you can create variety of concepts and blogs just by sliding the color palette and changing the pictures in your posts. One concept we have and we are going to include as part of the template in the future is a Dark Mode for Scribe, which you can see on the image.




The Typography


The articles themselves have a lot of space and the text is centered and set to a great reading width. The typography starts with Lato font, which fits the need perfectly, since its design is really similar to the ones we are used read every day, like Helvetica, Roboto, Open Sans, etc. As well as variety of different font styles, we have also added slight letter-spacing to make the text even easier to read. Thanks to the extra space we could also afford to use light version of the font. The credit for the design goes to Łukasz Dziedzic, who has done some incredible job on fonts in past years, including the Lato. 



The Pictures and Gallery

Last, but not least is the picture and gallery layout and placement. Martin Malinda, who practically stands behind the entire code of Scribe pulled of an incredible job when enabling the design I wanted to have. Pictures can be scaled from thumbnail size all the way to the full size and all of the versions look incredible. The gallery layout is designed so you can get the idea and previews of the other images that are included in the gallery.


But the design would be pointless without the actual product and the code that was only possible thanks to Martin Malinda, who has outdone himself and made this all into reality, for which he deserves a big credit!