Case Study: Readymag Design Workout

Case Study: Readymag Design Workout

www.awwwards.com awwwards.com6 days ago in #Design Love23

Readymag Design Workout is a collection of entertaining tasks intended to help designers stay creative and keep spirits high during isolation.They range from depicting your daily activities with an animated diagram to inventing functions for the buttons on a weird-looking remote control. The project was co-authored by DesignWorkout training program and the Readymag design team. Regular ‘workouts’ can sharpen your instinct for design Founded more than three years ago, DesignWorkout is an online program that revolves around creative thinking. It aims to help users develop essential skills for rapid design by showcasing peculiar challenges. These novel tasks form the basis of the project. ‘Daily ‘workouts’ cultivate the ability to see multiple solutions and pick the most effective, act boldly and make independent decisions. Each task is unique, and should take only 30 minutes or less to complete. Just enough to help to put the day on the right track’ says Dmitry Barbanel, the author of the program. The DesignWorkout system puts no limits on medium—feel free to use anything from paper and pencils to tomatoes and mozzarella. Still, one of our intentions is to encourage visitors to try out Readymag—a browser-based tool that helps create and publish web projects in WYSIWYG-style without the help of developers. Tanya Egoshina, the designer responsible for the look of the project, explains how her visual concept evolves. Moving things around The inspiration came from a list of exercises we received from the DesignWorkout team. When I looked at everything, I noticed that many were obviously inspired by the feel of paper and cardboard. You can move paper pieces of different colors to create a collage, glue or pin some of them to the background, and so on. I also wanted to show users straight away that they can interact with the project, not just browse through. That’s why I made the main page rearrangeable—you can drag and drop pictures and shapes wherever you want. Technically, this was accomplished with a piece of custom JS code (though Readymag is basically a no-code tool, it still allows you to twitch page sources directly if necessary) that makes non-text widgets movable. Text widgets had to stay in place like anchors, otherwise users might inadvertently destroy the structure of the page. That means they wouldn’t be able to return to the workable state without using the ‘refresh’ button. I devised the main page using this technique and liked the result: it had a vibe of freedom. So I decided to continue with the idea, using it on task pages as well, but reinterpreting it somehow each time. The first few pages were easy, but inventing new ways to use draggable shapes eventually became harder—that was my own creative ‘workout’ of sorts. Fonts, colors, and animations Readymag offers a rich palette of design tools, including a vast font library, animations, embed capacity, and more. One of my tasks was to show how to harness this richness, as limits are necessary for any decent design. That’s why I adhered to a certain minimalistic style throughout the whole project. The primary font is Graphik—it’s more or less the main font we use for Readymag projects, giving them a strong Swiss School feeling. I also used Druk as a secondary typeface. Colors (yellow, red, black, white) came from the DesignWorkout brand guidelines, though they also fit neatly into Readymag’s laconic color palette. This overarching minimalism allows you to be more creative with smaller elements.  » Read More

Like to keep reading?

This article first appeared on awwwards.com. If you'd like to keep reading, follow the white rabbit.

View Full Article

Leave a Reply