Readymag is a full-fledged tool for designing the web without coding. Celebrating its 10th anniversary in 2023, Readymag has undergone a transformative journey from helping craft online zines to becoming a robust design tool for landing pages, editorials, presentations, portfolios and beyond.

While the team continuously expands the tool’s creative capabilities, they also produce digital editorials covering social and cultural topics. These publications have become a powerful way of upholding Readymag’s core values and showcasing its full potential to creators.

Readymag’s Design Advisor, Stas Aki, and designer, Tatiana Egoshina, have played pivotal roles in shaping the vision behind these publications, infusing them with a unique blend of creativity and visual appeal.

In this post, Stas Aki and Tatiana Egoshina offer insights into the guiding principles behind their editorial design and a glimpse into the inner workings of some publications.

Attention-grabbing enhancements for any layout

“Designers don’t just arrange elements in a layout, they also direct the flow of attention on a web page. By dynamically changing the size of elements, you can easily highlight one part of a page or draw attention to another,” believes Stas Aki. The editorial Designing Women, which investigates the gender imbalance in the design industry, serves as an example of this principle in action.

Tatiana Egoshina shares her perspective, “The editorial layout of this publication enhances readability and overall comprehension of the content. It’s not just about aesthetics, emotions, and interactivity; design significantly influences the perception of content.”

Reflecting on the role of editorial layout, Stas Aki also delves into the relationship between web pages and content, “A web page has its borders, and it is essential to consider how they interact with content. Using WYSIWYG tools, designers can easily experiment within these limitations.”

Typography as a focal point

“Expressive typography helps ensure important elements on the page are not overlooked,” says Aki. Choosing typefaces that resonate with the content and experimenting with their size and position helps enhance the visual impact of digital publications.

One of Aki’s notable experiences in editorial design dates back to 2017, when he was working on Readymag’s animation feature. During that time, he came across Leonard E. Read’s classic essay “I, Pencil”, which explores the hidden intricacies behind seemingly simple objects.

Inspired by the essay’s narrative, Aki decided to experiment with typography while animating the essay title and chapter headings. “I wanted more of a cinematic experience or cartoon, rather than a straightforward web design project. This type of animated flow not only illustrates the content, but also guides readers through the entire narrative.”

The fluidity of the web

“The web is more akin to a fluid — your website can assume any size, shape, or structure,” highlights Egoshina, emphasizing the dynamic nature of web design. Her philosophy underscores the creative freedom and limitless possibilities offered by the modern web, as well as no-code design tools.

Readymag’s editorial Design stories, which celebrates influential 20th-century designers, draws inspiration from Edward Tufte’s principles of data visualization and employs a non-linear storytelling approach. The team endeavored to embrace the profound fluidity of the web, breaking free from its constraints.

Content is king

In 2022, the Readymag team collaborated with the Type Directors Club to create “The Faces Behind Typefaces,” an editorial that brings together insightful conversations with modern-day type designers and the stories of typography pioneers like Paul Rand, Emigre, Paula Scher, Ruben Fontata and others.

Tatiana Egoshina reflects on the success of the editorial, which was nominated for a Webby Award this year. “This project gained tremendous popularity and received more media mentions in a month than we typically would in an entire year. I believe the reason behind its success is the exceptional content. I thoroughly enjoyed reading all the interviews while working on the layout.” Aki adds, “The recognition this editorial received proves that impactful design is only possible when all the ingredients are of high quality, especially the text.”

Edutainment equals engagement

“Active participation is key to perceiving information deeply and maintaining readers’ focus while consuming digital content,” says Egoshina. The Readymag team’s goal with the Debris of Attention editorial was to explore new ways of engaging readers. It takes the form of a game that allows readers to remove distracting elements and freely read the text, promoting active participation and critical thinking.

The editorial Oracle Cards of Design Manifestos is another example of edutainment design. Each click reveals a piece of design advice from luminaries such as Experimental Jetset, Paola Antonelli, and Dieter Rams. Egoshina’s inventive approach showcases how combining entertainment and education can unlock the full potential of each learning experience.

Throughout its decade-long journey, the Readymag team has evolved and grown by always walking in the user’s shoes. They’ve been creating online editorials, promoting their values, and actively contributing to the design community. With Stas Aki and Tatiana Egoshina at the helm, Readymag’s editorial projects consistently push the boundaries of digital storytelling and inspire designers and creators worldwide.

Readymag

Visual storytelling with Readymag

Editorials created with the tool

Unearthing the principles behind Readymag’s editorial design was originally published in TMDesign on Medium, where people are continuing the conversation by highlighting and responding to this story.

From passive to actionable

The web is an organic, ever-changing environment and user expectations for websites have grown over the years. At Readymag, we do our best to help designers create fresh and immersive content that pushes the boundaries of the web. As a part of this effort, we introduced Shots — a unique tool that turns videos into a sequence of viewer-controlled experiences. It’s the perfect way to bring interactive animations to a new level. Developer Ilya Shuvalov describes, from idea to implementation, how Shots was developed at Readymag.

Searching for more interactivity

Elements in motion are much more expressive than static ones. They’re easy to perceive and convey the author’s intent in a simple and quick way. However, passive video and animation viewing doesn’t deeply engage users with a website. The next engagement level is the reaction to videos and animations for user actions, such as pointer movement, scrolling, clicking and tapping.

Adding interactivity to the video widget has been a long-time goal for Readymag. We would try to make videos play/stop on hover, or quickly change the current frame with cursor movements. However, we quickly found out that this cannot be done with videos hosted on most video platforms. Typically, their terms prohibit hiding controls. Moreover, the video itself might have a number of limitations — like a format unsupported by the web, too low or too high a bitrate, huge sizes and slow load times, and so on.

So we came up with a new idea: to make a widget that would enable interactive videos/animations in response to user actions.

A similar type of content is often used by Apple on their landing pages. As a rule, these are custom handmade solutions; not a universal widget, as in our case.

In this project, 3D Shots fit in nicely with the project’s overall minimalist style. It becomes a bright accent that grabs attention and helps viewers immerse themselves in the website at a deeper level.

Setting requirements for the future widget

We started looking into potentially applicable technologies for a new widget with a list of requirements:

• The widget should work quickly and smoothly in all browsers, and on different types of devices — including low-power smartphones.
• The process of uploading video/animations to the widget should be simple. From the user’s perspective, it must be as easy as uploading an image.
• When loading a page with the widget, the first meaningful paint should appear as early as possible. That is, the user should almost instantly see something happen on the page.
• The widget should play video/animation back and forth depending on the user’s actions: scroll up/down, hover on desktop, touchmove on mobile devices.

Exploring the field of technical limitations

The first and most obvious thing that came to our mind was to use the <video> tag and the JavaScript API to navigate video files back and forth. This approach seems actionable, but there are a number of significant drawbacks:

• The user might upload a video in an incompatible format. It can be re-encoded (re-encode), but it will take some time and require significant resources (CPU power).
• Encoding options vary: bit rate, resolution, number of keyframes and so on. All this affects the quality, speed and smoothness of playback.
• Videos may not play as smoothly on older devices, especially if the visitor moves quickly from one part of the website to another.

Further experiments brought us to the idea of ​​using the <canvas> element, a technology that has been around for decades and is supported by all browsers (including older ones). Canvas also works as fast as possible, even on very slow devices.

Dichotomizing videos into image sequences

Eventually, we developed the principle of operation for our new widget: the user uploads his or her video to be recoded into a set of image frames on our server. When a page with a widget is shown, these images start to load and are very quickly displayed (paint) in response to the user’s scroll or hover.

Individual frames/images weigh much more (download size) than the volume of the original video, so they take more time to load. However, the loading algorithm that we use allows us to see the animation on screen almost instantly. In the first few seconds, the animation may look a little chunky and not play smoothly, but as it loads, smoothness improves quickly.

We used the dichotomy algorithm, which starts by loading the first and last images from the sequence, then dividing the entire sequence in half and loading the image from the middle. Bisection is repeated as many times as necessary until all the images are loaded.

Uploaded videos are turned into a set of images through AWS Lambda. We use the ffmpeg converter, which is connected to Lambda as a Layer. The video that the user uploads is directly piped as an input video stream to ffmpeg. With it, we get by without intermediate saving and avoid further strain on our servers. ffmpeg converts videos to pictures, then they are uploaded to AWS S3 storage.

After that, metadata about the set of images (basepath, dimensions, format, and number of frames) is returned to the widget. High resolution video often produces very heavy images — each can weigh up to several megabytes, so we use a progressive JPEG quality scale. The lower the resolution of the image, the higher the quality.

There’s a feeling that the project gallery acquires materiality and succumbs to its own unexpected laws of physics. If you take a closer look, you’ll notice that the composition in which the images are placed is pretty simple and widely used in design — but the volume and the user’s ability to interact with it help set this project apart from the rest of the portfolio.

For users who are not satisfied with the quality of images after conversion, we have added the ability to upload your own set of ready-made frames (image sequence) in JPEG and PNG to the widget. In this case, we do not convert or resize the files. For PNG, we support the alpha channel setting: this enables you to use images with transparency. The sequence of pictures in the finished project is displayed as is.

​​Readymag users can adjust the appearance and playback of Shots. For example, they can change the frame rate depending on scroll speed or cursor movement, as well as adjust the start of playback depending on the current position of the widget on the page.

The Shots widget helps create a focal point that sets the project’s mood. It’s a cool solution with a text you can read only at a certain point — this way, viewers are even more engaged.

Turning out better than imagined

Experiments with different technologies had a great impact on the final version of our Shots widget. In the course of development work, the idea underwent drastic changes and eventually crystallized into a solution we didn’t consider at the beginning.

It turned out to be fundamentally better than the original: the Shots widget works quickly and smoothly on a variety of devices, adding a completely new type of interactivity to your projects, and a new layer of customization when it comes to appearance and playback.

Readymag is an in-browser design tool that helps create interactive websites and online publications without the hassle of code. It works like a graphics editor with enhanced capabilities for the web: draw up the design of your project, add multimedia and animations, see how it looks on various devices, and publish it online in a single click.

How Readymag invented Shots to convert video into controllable image sequences was originally published in Geek Culture on Medium, where people are continuing the conversation by highlighting and responding to this story.

Diana Kasay, co-founder and CEO of Readymag:

Business is known to be hard, even if it’s a design business made up of inspirational mood boards, minimalist offices, sexy coffee tables, and Notion Kanbans that look so good you could hang them on a wall.

It is still a highly competitive market with hundreds of companies fighting for a place in the sun and for a place in design history.

Readymag is a relatively small company founded in 2013 and flourishing ever since. We’ve managed to build a world-class product for designers all over the world, including independent creators, brand agencies, and enterprises like Amazon, Complex and Ideo.org. We did it with a team of just under 50 people and a lot of love. We also managed to create a service that complies with my personal ethics. So allow me to share some lessons I’ve learned and some convictions I try to unlearn.

It’s shameful to be ambitious?

Fifteen years ago, just after high school, I got a job at a creative and sought-after design firm. I reported directly to top managers — all men — and learned from their expertise. I absorbed their knowledge like a sponge, but unfortunately I absorbed their ambiguous ideas as well. Some of these ideas have had a significant impact on my career since then.

During this time, I learned that I should work like a good waitress: do my job well and be invisible. This idea stuck in my head for years. I developed a habit of devaluing my accomplishments: I didn’t take credit for the success of the projects I supported, passing the spotlight to others. I refused to be a speaker at professional events or to take teaching positions, and I didn’t consider myself worthy of promotion.

It’s not shameful to be ambitious

So, right before founding Readymag, I combined organizing events, a design bureau job, and managing the band my husband was playing in. In other words, I was engaged in all the possible types of operational work one could imagine. Obviously, such work wasn’t about pursuing my ambitions, but following other people’s goals.

Everything changed in 2013 when I visited my Ukrainian friend, designer Anton Herasymenko in Kyiv. Anton came up with the idea of a highly visual platform for designing and publishing online zines. Back then, personal blogs were all the rage, but, at the same time, customization options were scarce, and designs looked unsavory. Anton shared his vision and even showed me some layouts — that’s how the story of Readymag started.

Shortly after, we were joined by the third co-founder, Kirill Danchenko, who took on development. The ambitious project was all about creating an elegant and extremely bold tool in tandem with friends. We managed to collect some $230 000 from friends and former colleagues and started out as a team. Our office was constantly on the move: at first, we were based in the flat of one of our founders, then at a friend’s apartment, and after that, in a tiny attic. We took out personal loans and sometimes borrowed money from friends to repay old debts. But we always paid our employees on time.

It was a time to challenge everything I knew. There was no actual business, just three enthusiasts doing everything from scratch. Startups, fundraising rounds, launches, burn rates — we had to learn those words on the go. Back then, our budget took up five lines in Excel, and even those were incorrect.

When we’ve just launched, we experienced a giant leap: in one year more than 16ooo people were using the tool. However, this was followed by a drop — and we were genuinely surprised. No one had in mind that, apparently, it happens to every company — there are twists and turns, seasonal fluctuations and unforeseen expenses. And gradually, with all of that came organic growth. Our ambitions scored a win and our risks paid off. That was the lesson on dreaming big and not giving up on challenges.

Trust the mission?

In 2016 I took the CEO position, and the new role came with a duty to be public. I had to reconsider a lot of things, and one of them was the question of Readymag’s mission.

At Readymag, we have a shared passion: to bring about new visual languages for the internet. We create tools to empower creators and publish our own projects. However, we’re not mission-driven; we believe that the need to build up things and cooperate with other humans is not a mission, but a natural drive.

Trust yourself more than the mission

I believe ‘the mission’ works only if you respect the effort put into it. I don’t speak much about missions with my coworkers. If what we’re building has a greater goal, it will become evident. I do what I can to provide the tools for my colleagues to carve their own paths. Things work differently for every company. At Readymag, a mission can’t replace fair working conditions, and a high salary can’t compensate for futility.

This approach also works for the product itself. It’s hard to compare the present-day Readymag with the product it was in 2013, but I would say it was a creative, rebellious teenager who turned into a reliable partner in work. Back then, we cared most about the wow effect — and believed that every new feature would be a killer one that everyone would love and use. It turned out that growth and user loyalty look a different way: you keep testing hypotheses, tuning the product, and all of it eventually leads to growth.

All of this is also reflected in our editorials. At the very start, we were creating complex multimedia projects where almost every word and every picture was animated. Now our editorials are still eye-filling, but far more laconic and user-friendly.

Do you have to be loud to be heard?

When I became CEO, roles and relations within the team also changed — I was discovering my leadership style. At a certain point, I realized I didn’t want to go to work. This feeling was persistent. We were so caught up in reaching our individual or departmental KPIs that we forgot the importance of being friendly. If someone wasn’t listening to you, you raised your voice. If they doubted your vision, you squashed them with your experience. If they doubted your expertise, you strangled them with data. There was an obvious need to change our approach and reconsider our values to make Readymag a safe space for everyone.

With this in mind, we defined the principles of the company’s work — mutual respect, dialogue, and freedom of self-fulfillment. But for all of these principles to work, we needed not to speak, but to listen.

You have to listen to be heard

As CEO, I decided to transform myself first, and only then the company. That aside, becoming a mother helped me to reevaluate my principles and approaches. Both children and adults want to be heard, treated with attention, and encouraged. Of course, it doesn’t imply a paternalistic approach to managing employees — I don’t control anyone, but transfer the responsibility for results back to them. That’s the balance between freedom, self-actualization and full responsibility for the outcome.

So I started talking more to my colleagues. I didn’t hold myself back from expressing interest in their beliefs, hopes and ambitions. I wanted everyone on my team to have the space to treat one another with genuine interest, compassion and care. Our team’s productivity shifted for the better. When people feel safe to express their doubts and have the tools for constructive criticism, they take more charge of their work and are more involved in the common goal.

Is success measured by numbers?

The confirmation that our idea worked out right came in the fourth year of Readymag’s existence, by the end of my first year as CEO. We’d grown into a profitable company and wanted to increase the income. We experimented with advertising, PR and paid partnerships, but eventually realized that organic growth and word of mouth worked the best for us.

Success is a feeling

This discovery made it possible to change Readymag’s business strategy. I knew that values could sometimes be lost when companies grow extremely quickly. So, I chose sustainable development over the classic venture path to raise investing rounds. As of now, we have not been fundraising for years. The company is living by its own means, remaining profitable. We are focused not on capitalization and investor interests, but on the needs of our users and team. This was not an easy decision. I had to face my own fears in a highly competitive market where other companies raise tens and even hundreds of millions of dollars.

This strategy proved to be the right one for us. This year, purchases from the USA alone, one of our key markets, have grown by 45% and counting.

I believe in the path I chose. However, it has its limitations. We can’t pour money into marketing without careful planning, and we can’t fail in our employment choices. So, we’re cautious with our approach to both hiring and marketing.

Listen to the users?

From the very beginning, Readymag was highly appreciated by the design community. Our users were quite active, so we always had a lot of requests and insights. These days, we also gather feedback from many sources. We never release a new feature without beta-testing. We add features to a wishlist from requests to our support team, in-depth interviews with users, short surveys, comments on Instagram, and literally everywhere.

It’s crucial to collect feedback, hear your community and be receptive to constant changes, but this doesn’t mean simply doing whatever you’re told. Listening to others and not trusting your gut feeling may move you in the wrong direction.

Listen to your heart

The key to balance is being confident enough in your expertise to lean on it while incorporating insights into your vision, business strategy, and personal sense of right and wrong. To achieve that, you need a lot of trust: in yourself, your teammates, and the world in general.

As an example, our users have been asking us to add the Shadows feature for years. We were hesitant, as we doubted the aesthetics. Finally, we followed the request, and the team worked harder to bring extra value to the feature by adding an entire list of additional options.

These are some of the things I’ve learned while running my own company. And I’m sure we have many other lessons ahead. But I strongly believe that regardless of the path we choose for Readymag and the principles we follow, we will always invest love and care into every decision.

How I built a design company that complies with my personal ethic was originally published in Muzli - Design Inspiration on Medium, where people are continuing the conversation by highlighting and responding to this story.

Just a little heads-up: this blog continues on a new platform, but preserves the same URL.

The archive of older pieces remains in Medium and new articles will no longer be published here. Switch to our new blog to read the latest Readymag updates and find inspiration — your massive journey into the exuberant world of web design is just beginning!

Subscribe to our newsletter

Design your website with Readymag

Master your Readymag skills

Switch to our new blog was originally published in Readymag on Medium, where people are continuing the conversation by highlighting and responding to this story.

Presence on social media is useful: designers share that blogging helps them find most of their big contracts, gain professional visibility, come up with fresh design ideas and form a vital personal community. But the world of social networks has some traps and pitfalls. To navigate you through this tricky but rewarding practice, we’ve turned to two outstanding graphic designers, Katrina Romulo and Elliot Ulm, who run ever-growing Instagram pages with 50K and 100K audiences respectively. In this piece, they open up about their tricks for success that you can implement in practice.

Katrina started out designing in college, and to continue her path, went to Berkeley University for sustainable environmental design. Her program wasn’t a graphic design one, but it was the closest thing to any sort of design at Berkeley. Katrina got her degree in 2021 but thinks of herself as a self-taught designer because most of the skills she’s learned came from the student community or her own studies. When the pandemic started, all of her lectures were held online, so Katrina found some spare time for her passion projects. She created her Instagram account before the lockdown, but during the isolation period in October 2020, Katrina started to design brands for fun and post them on her page as part of the ‘Brandtober’ challenge. That’s when she first got public attention. Slowly but steadily her audience began to grow, and she now has 50K followers on Instagram.

Every opportunity that I don’t apply for myself comes through social media: client projects, interviews or collaboration requests. I believe Instagram plays a humongous role in the professional career of a designer, as the reach here is colossal compared to any other platform.

— Katrina Romulo

Elliot created his page around three years ago. Back then, he decided to go the self-taught route in design and started his Instagram account mainly to pile personal works into a portfolio. He came up with different concepts and made real cases out of those ideas. His second post with a set of honest business cards blew up and triggered organic growth. At the beginning of 2020, Elliot hit 10K followers and got the swipe-up link. At present, his audience on Instagram has reached 100K.

In most cases design is considered a client-based thing when you make something for someone. People underestimate how fun and how exciting graphic design is when you treat it as art and express yourself through it on social media. That helps you develop a new appreciation for your own work.

— Elliot Ulm

Share your passion

Katrina: Part of success is diving into whatever idea comes to your mind, something you’re really passionate about. Instagram is very fickle, and you really don’t know what’s gonna flop or take off. So I believe the best practice is to be passionate and not put too much pressure on yourself. Don’t make something for the sole purpose of getting a lot of likes — just try to have fun with it. When you’re enjoying your work, other people will pick up on that. I have a whiteboard with ideas behind my desk and throw in any idea that pops into my head. So when I’m in the mood to sit down and design I just look at my little whiteboard and pick an idea to work on.

Elliot: Do what you love. That’s the trick that works best on social media. On my page I combine two passions of mine: graphic design and comedy. I add a bit of fun to my Instagram posts and stories, and joke around with my audience on Twitch streams. Comedy helped me on my way to success and gave me great inspiration for my posts. As long as you can find something you love and combine it with graphic design, you’ll be great at creating unique works that people will look for.

Lean into Reels

Katrina: Keep in mind that Instagram is no longer an image-sharing platform, but a video-centered one. That transition can be really scary, especially for a graphic designer, because you’re making a lot of still images. But you can always lean into reels and try the video tricks Instagram suggests. People really appreciate behind-the-scenes and process videos, and just want to get onto new things. Some of my followers share that they’ve learned so much just by watching my fast time-lapse processes. So just film yourself embracing the process and make how-to posts to get big reach. And don’t forget to pick a trendy sound, keep the video fast-paced, and stick to an engaging length of time.

Post on schedule

Elliot: Every social network is a business. And there’s an algorithm, which serves the business’s purposes. If you want the algorithm on your side, you have to keep people on Instagram as long as possible: make them spend more time looking at your work, reading your captions, and saving your content. The algorithm is constantly changing because it’s learning from things, so you have to teach it what your content is, when you post it, and when your audience wants to see it. Make sure that you’re creating some sort of schedule for posting and try to stick to it. But in any case, don’t put too much pressure on yourself. If you miss a day or two, nothing will happen. But keeping up with the schedule can be easier by using Facebook Creator Studio or another app to plan posts.

Pick popular references

Katrina: Know your target audience and act within it. My audience is pretty young, so I lean into standard pop culture references that I personally love and that my audience might also like. People also resonate with fun things that are a little bit out of the norm, so try to work on whatever funny little things pop into your head.

Mind the attention span

Katrina: Posting on social media can be tricky. One time I created a video on making a book cover. I put a lot of effort into it and even learned After Effects to animate text messages popping in, but it pretty much flopped. I think the beginning wasn’t catchy enough, so people weren’t interested and just scrolled right past it. Now I feel like the key to capturing an audience is to acknowledge that our attention spans are really short. There’s no room for creating intricate beginnings, you just have to get right into it.

Treat hashtags wisely

Elliot: While hashtags are considered one of Instagram’s promotion instruments, I believe they don’t really matter. But if you’re into using hashtags, be sure to make them different, otherwise Instagram will think you’re spamming. Try not to experiment much, just know that consistency will pay off. If you’re just starting out, a great option is to borrow hashtags from a popular account that gets a lot of engagement. But with that comes a weird rule of thumb: the bigger your account gets, the fewer hashtags you should use. I stopped using hashtags entirely and found that I was having better results without them.

Make something recreatable

Katrina: Making projects that other people want to recreate or take inspiration from is great for engagement. I recently made a small magazine filled with pictures and typography for my friends as a post-graduation gift. I posted a very quick video showcasing a bunch of pages and got a lot of requests to make a tutorial on it. The magazine resonated with people because it was something they could recreate for their friends and family.

It’s also great to make tangible versions of your designs. Some time ago I realized that I’m a graphic designer who has no art on my walls, so I came up with my ‘Calm’ poster. I had no idea that one was going to blow up the way it did. People really enjoyed watching the process video and the result of me rolling out a tangible copy. A lot of them ended up recreating their own versions of the poster, which was really inspiring.

Gain reach with TikTok

Elliot: If you want quick growth, start a page on TikTok, because it will promote your work more than Instagram. Going viral on Instagram is a matter of chance. A lucky post is the one that just stands out and gets shared a million times. But TikTok works differently and can make anyone go viral. Also, you can give Instagram videos a go with TikTok. Turn any of your content into a video, put it on TikTok, then convert it back to Instagram. The reach will be bigger.

Regard your audience as clients

Elliot: On social media you have to convince people that you’re worth following and your work is great. So make sure you’re presenting your work to the audience as you would to a client — as something big and awesome. If you post with that kind of confidence and have fun while creating, people will feel it and enjoy your content.

Show the real you

Elliot: It’s crucial to be human on a very robotic platform. People don’t want to simply follow the design. They want to follow you as the graphic designer — that’s the whole point of Instagram. So don’t fall into the trap of being just another brand or a portfolio page. Check your face on your profile picture and chuck photos of you in a carousel, alternating between graphic design and real-life content. Being present is such a big thing.

Katrina: Be authentic and speak about your beliefs and passions. Eventually, you’ll be able to reach an audience that’s passionate about the same stuff. At the end of the day, it’s easier to resonate with someone who talks about their feelings and shows their face than with someone who’s entirely professional. Also, it’s easier to find clients and form relationships with them when they have a better idea of who you are and what you believe in. I’ve attracted great clients that I really enjoyed working with this way. Recently I made a poster for Refinery 29 in support of abortion rights. It’s always nice to be able to speak up about what you believe in, and sometimes it leads you to other people with like-minded values who want to work with you.

Sign up for beta testing to try new Readymag features before anyone else.

Join Readymag to design complex, interactive web pages right in your browser.

10 tips for designers on social media promoting was originally published in Readymag on Medium, where people are continuing the conversation by highlighting and responding to this story.

There is no road for the wanderer; the road is made by walking. This same concept applies to your career: the steps you take make up your path. But have you ever mapped out the moves you need to prepare yourself for your dream job in design?

Airbnb Design Lead and Readymag user Doug Alves believes that regardless of how long you’ve been in the workforce, it’s important to be proactive when shaping the future of your career.

In this article, Doug analyzes the path that led him to his top-tier position and offers advice on designer career growth. Heeding his words will help you become an in-demand design professional.

I started my career in Sao Paulo, Brazil back in 2000 working in the digital departments of interactive shops and advertising agencies. In 2007, I got an offer from a digital studio based in Los Angeles and moved to the US.

In 2010, I shifted to brand design and spent eight years building design teams in advertising agencies in Los Angeles as a Design Director. In 2018, I joined Facebook to help to establish visual systems for facebook products. I learned a lot but I always enjoy working with visuals systems and product design and Airbnb gave me this opportunity to work with both. Currently, I’m a Design Lead in the DLS team at airbnb.

— Doug Alves

Find fields that inspire you

I have always been interested in design, even not knowing what design meant to me. I would ask people to bring me menus from restaurants in different cities and countries. I would collect packages or anything related to design. For several years I’ve been changing various jobs like selling chocolates and lemons and other things but aged 16, I got my first office job. It was not related to design, but there I found a computer that no one was using and started learning design-related software. Along with this, I started reading some books about graphic design books and design tools for beginners. I felt so excited!

I guess sometimes even if you are not doing what you want you can learn new things but the key is to find what inspires you to keep you on the right path.

Develop skills that give you an advantage

I don’t have design-related higher education. Even though I wanted so badly to be a designer. Back when I started designing I practiced a lot on Adobe Photoshop and Macromedia Flash. The second one was lesser-known by most applicants, so it became my advantage when I applied for my first design job. I’ve always been curious and in love with design and Investing time to learn new tools was helpful in my journey.

Invest in your portfolio

When I started I had no interesting projects, but I cared a lot about everything I added. Trying to blend my artistic side with my commercial projects was tough for me. I had no one to tell me which projects were the strongest and I was scared and worried about being judged by my skills. Back then, it was acceptable because that demonstrated my range of skills and my craft and expressed how much I cared about my portfolio back there.

Today my portfolio represents what I want to focus on. I intentionally left things out because some projects don’t express my work today. Earlier, my portfolio was focused on illustration and now it’s focused on product design and graphic design. Readymag helped me to create the right balance for what I need my portfolio to express today. I love how all design system elements like the grid, typography, color, and even animation are easy and intuitive to use. It also allowed me to visualize my portfolio at different breakpoints which saved me time.

Although a portfolio is not the only way to showcase your work nowadays, social media matters much. I view my Instagram account as an extension of my portfolio: I share my personal and commercial projects, process, and studies — anything that helps others understand how I see the design.

Calibrate your role

My role at Airbnb as a lead is to think about the future of our product and our design language. I try to lead by example offering different visual perspectives to everyday problems. Also, I collaborate with other leads and designers learning from how they work and tackle problems — that’s what makes working at Airbnb so interesting to me.

Generally, in the tech industry there are different levels of designers, and what differs from a junior level to a mid-level is the accumulated experience. But you will be able to participate and share your ideas with no regard to your level of experience.

A junior designer will be expected to take directions from a senior designer, request feedback and help take the project to the finish line on time. While a mid-level designer will be expected to explain the intentions behind their designs and take more responsibility for their work.

Senior designers are expected to see projects from a broader view, drive multiple projects, communicate effectively about the project’s goal to partners and mentor other designers.

It’s important to note that once you become a lead you can always choose your path. If you want to lead projects and processes and be recognized for your tactical skills you can become an individual contributor (IC) but if you want to be recognized for your leadership skills and be responsible for a group of people you can choose to be a manager.

Other design-related roles are important in a company: recruiters, design producers and managers, writers and strategists. For example, proceeding from my experience in tech — a design manager helps unblock designers, provides guidance, helps define strategy and makes sure projects have the right members to ship a project.

Also adaptability, work ethic and teamwork can be helpful skills that navigate your growth at any position in the design industry.

Best books on design as selected by Doug Alves

• Design by wangzhihong.com: a Selection of Book Designs 2001–2016
• Grid Systems in Graphic Design
• Stockholm Design Lab: 1998–2019
• Experimental Jetset: Full Scale False Scale
• Issue 8 New type design — Actual Source books
• INDEX magazine, issues 1 and 2
• 1970 NY City Transit Authority Graphics Standards Manual
• Logo Modernism
• Nasa Graphics Standards Manual
• 30 Years of Swiss Typographic Discourse

Join Readymag to design complex, interactive web pages right in your browser.

Sign up for beta testing to try new Readymag features before anyone else.

4 ideas from Airbnb Design Lead on how to level up your design career was originally published in Readymag on Medium, where people are continuing the conversation by highlighting and responding to this story.

“If you can’t summarize the hook of your pitch in a sentence the pitch isn’t newsworthy.” Journalists on pitching design work to the media

While dabbling in the world of publicity might be intimidating, it’s always a badge of approval for any creative entrepreneur to get the spotlight. In this interview, we talk to representatives of the leading digital publications in the creative industry — Creative Boom, Communication Arts, and Brand New — about what it takes for a designer to land media placement and what actually wins journalists’ attention in a pitch.

We regularly post web projects made with Readymag on our social media channels, in our Examples section, and give them a bigger voice via our annual Websites of the Year competition. We believe that everybody has the right to present themselves to the world, but when it comes to media there are always special rules to be followed. How can you craft a newsworthy pitch that wins over the media? Which design works are worthy of attention? Are there any peculiar rules of communicating with journalists?

These are some of the questions we put to Katy Cowan, founding editor at Creative Boom; Armin Vit, co-founder of the Brand New publication; Patrick Coyne, Editor&Designer of Communication Arts.

What type of design work is likely to be newsworthy?

Katy Cowan: At Creative Boom newsworthy design pitches tend to be big brand overhaul announcements or inspiring designs from leading studios. However, our audience loves seeing work from emerging names as well. A charity initiative that, perhaps, took over a city for a certain event might also win attention. Newsworthy projects may simply be colorful and fresh, but others that offer inspiration to the creative community are also a good fit.

Great imagery always helps, so make an effort to create vibrant and interesting images and videos to showcase your work.

Armin Vit: Over the years I’ve fine-tuned a set of criteria that provides a consistent framework for deciding what to include in our publication based on the size of our audience. I imagine some of this applies to other design publications.

The first question I ask is if the project is of broad interest. So, in our case, the bigger the design client, the better the chance it has of being posted. We wouldn’t post the redesign of a small, one-location burger restaurant, but we would no doubt post about the redesign of Burger King — because a whole lot more people are going to be interested.

If a client isn’t huge, I’m looking for design work that is interesting and unique. Does it offer something new? Does it do something differently? It doesn’t have to be groundbreaking, because that is very rare. It just has to have enough of a twist to make it post-worthy. For example, the NEXT insurance identity by COLLINS chose a very unexpected style and artist. Although using illustrations is nothing new, offering a new approach to selecting a great style made this project much more newsworthy. Another example would be the monogram created by Champions Design for Carnegie Hall, that featured a reverse italic “CH” that was unlike the vast majority of monograms. So it offered something new and unexpected.

In the end, a lot of it comes down to gut feeling and knowing when something will be of interest to a large swath of people.

Patrick Coyne: On Communication Arts, identity programs, motion and environmental graphics, and packaging projects tend to receive the most views. Of the recent projects we chose to profile, I’d single out BOLD Capital Partners’ website. This modern, intuitive web page portrays the essence of achievement, ambition and sophistication — encapsulated within the company’s ethos. The strong, design-heavy site is atypical for the venture capital sector.

Scrolling through recent additions to Readymag Examples, two most captured my attention: the Babyn Yar research with a terrific scrolling timeline and NN Coltoy’s entertaining explanation of their updated typeface.

What should a creative professional use as the first point of contact when pitching to the media?

Armin Vit: Use whatever email address is listed on their website. Never call. Or, at least, never call me. Maybe other publications like to answer the phone, but a phone conversation doesn’t allow me to absorb what’s being sent and there is an expectation of an answer in that case.

Avoid contacting publications through Instagram DMs. We get such a high volume of messages there that nothing can get the attention it deserves.

Katy Cowan: I’d recommend always checking a magazine or blog’s website for a submission page. You’ll often find bespoke instructions on how to get in touch. If not, don’t be afraid to contact an editor or staff journalists. They might be swamped with emails, but they’ll pick up if your work or story stands out.

Drafting a worthy pitch may feel mostly like a struggle. Could you share some advice on how to write a pitch that journalists can’t ignore?

Patrick Coyne: For design projects, defining the problem for quick comprehension, then describing the solution with interesting background details about the execution — including unexpected challenges, new lessons learned and quality imagery — makes a compelling pitch.

Katy Cowan: I’d recommend to submit the best projects only and go out of your way to provide everything the journalist might need. Don’t make them chase for images or extra information. The more effort you put in, the better it is for us. Sending lazy submissions that simply say, “Here is a link to my portfolio” and nothing more is never the best choice. Journalists don’t have time, sadly. Make their life easier by sending them a thorough pitch.

Tell me in either the subject line or the very first line why, not only I should care, but why others should care as well.

Armin Vit: Tell me in either the subject line or the very first line why, not only I should care, but why others should care as well. If you can’t summarize the hook of your pitch in a sentence the pitch isn’t that newsworthy or the project is too complex and neither is a good thing. It goes back to my premise of things having even a little bit of a twist whereas any quick pitch that lets me know this project deviates from the norm stands a good chance.

What are the most common mistakes a designer makes when submitting their project to the media?

Armin Vit: The most common mistake to me with pitches is where they go “Hey, we did this! If you are interested in seeing it, let us know”. Include the work or a link to the work from the initial point of contact. We get so many submissions and if I have to take an action or extra step to publish your work, that’s something I am not going to bother with following up on. It’s always about making that initial email as comprehensive as possible so that I can make the most informed decision about posting or not posting. A “teaser” is useless.

It’s always about making that initial email as comprehensive as possible so that I can make the most informed decision about posting or not posting.

Patrick Coyne: Submitting image files without adequate explanation makes it hard to evaluate a project. Also, case studies that describe the response (i.e. number of likes, unpaid media coverage, etc.) without actually showing the solution are particularly annoying.

The PR industry has a bit of a cut-throat reputation. Does that mean that designers should be assertive when pitching to the media?

Patrick Coyne: An initial pitch and then a follow-up email a few days later, if there has been no response, is standard practice. I wouldn’t recommend being more aggressive than that.

Armin Vit: If a pitch is too assertive, too confident, or it starts to subjectively define itself — like “XXX Firm creates Groundbreaking New Identity” — I have an immediate adverse reaction. Tell me what you did, in a nice tone, and why it’s interesting. Send an email once, follow up once and that’s it. If the follow-up isn’t answered, that means there is no interest. I do sometimes miss an email or delete an original email by mistake so I do appreciate follow-ups, but a second follow-up is unnecessary. Take the hint, move on and try again.

Katy Cowan: When promoting yourself and your work, don’t take anything personally. Be assertive and know that a decent considered submission to a journalist will stand a good chance of success. But if it doesn’t, it’s not a reflection of you or your work. Competition is fierce. Just keep trying.

Where to submit your design work

Communication Arts. Features innovative graphic design and advertising projects, outstanding websites, as well as cutting-edge work from individuals, firms and agencies that have been working professionally for approximately five years or more. You can send as many projects as you like and as often as you like for any department. Submit your work.

Brand New. Logos and identities for well-known companies have a 100% chance of getting featured. Aslo, each Friday the editorial team selects three projects in a long-standing series called Friday Likes. These tend to be for small clients, one-time events and single products. Read their guidelines.

Creative Boom. A nice platform if you want to showcase your work, share professional insights, and even nominate yourself for a brand podcast or interview. Emerging creative professionals can also head over to the Inspiration section. Check it out.

All options are free. Just take your chance to get featured and keep moving!

Sign up for beta testing to try new Readymag features before anyone else.

Join Readymag to design complex, interactive web pages right in your browser.

Journalists on pitching design work to the media was originally published in Readymag on Medium, where people are continuing the conversation by highlighting and responding to this story.

How to ensure seamless collaboration with clients. Tips from Readymag

To have a 100% success rate with your clients, you have to be on the same page with them. Better communication helps set clear expectations and articulate challenges, but it can be tricky. Vision changes, timeline shifts, and new edits aren’t uncommon — this could all take a toll on your relationship with your clients.

In this article, discover key communication tactics that will help you eliminate the risk of misunderstanding, and stay in sync with your clients throughout the entirety of your projects.

The article was originally published on Dribbble.

1. Cover the scope and set expectations

Planning is a crucial stage that sets the foundation for any successful project. This step involves much more than bouncing ideas off each other as you gather project requirements, budget, and outcomes.

The most effective planning roadmap looks like this:

STEP 1

Hold an initial ideation meeting to discuss project goals and understand your client’s needs. This is the phase where you both get to know each other. Try to collect as much information about the client as possible beforehand. Take a look at their website, social media, and competitors. Dig deeper into their business industry.

When it’s time for the meeting, ask questions to better understand the client’s assignment. This approach pays off and shows you’re not just a task-taker and genuinely interested in the project.

STEP 2

At this stage, propose solutions to your client’s problem. Outline key deliverables and outcomes, identify possible constraints, and discuss them with the client. Make it a point to set up the project timeline at this step and include here time for collecting feedback, revisions, and finishing touches.

STEP 3

Now, it’s time to assess what you need to succeed such as funds and tools. If your client wants to check up on the project regularly, use a collaborative design tool with multiple permission levels and allocate a budget for it. With Readymag, a design tool for creating websites without code, the cost of plans with collaborators starts at $22.5/month.

STEP 4

Put together a detailed proposal containing the scope, budget, and timeline and confirm it with your client. This is helpful for two reasons: you demonstrate that you understand the task at hand while also proving your expertise and customer-centric approach.

The planning stage is officially complete–you can move further with the project.

2. Collect feedback by continuously–and show up often

While navigating the design feedback process can be challenging, it’s possible to make it more pleasant for everyone. Simply follow these tips:

Start the design feedback process with questions. Sometimes customers can’t articulate their wishes well or they have no clear understanding of what they truly want and feel about a design. Since your customer is your best source of product information, reach out to them often to gather more information that gives you the clarity you need.

Present ‘live’ prototypes, collect feedback, and iterate. This tactic will help you work with client comments more smoothly, minimize revisions, and enable customers to interact with a real website. To simplify the process, use collaborative design tools like Readymag.

With Readymag, you can invite collaborators and publish private websites so that only your customers can visit the live online page. If your client wants to make a slew of minor content tweaks, you can assign them a Layout locked mode so they can make edits without the risk of breaking the overall project structure.

Don’t dismiss negative feedback. If there are too many tough comments, it’s better to schedule a call and talk in person. Go back to the design brief before this call, make a list of changes that could be made straight away, and be ready to discuss the things that can not be changed.

Have a backup plan. If things don’t work out the way we want them, apologies are great but your client’s business needs something more than mere words. Provide the client with new solutions.

3. Tie up any loose ends before the handover

Work through a pre-launch checklist before you hand off the project. Did you manage to hit all requirements and outcomes? How does your project look at different devices and screens? Is it indexed by search engines?

You can use this checklist before publishing your client’s website. Use it to make sure that your online project is ready to go live, does not break the law, and is accessible to a wider audience.

Handoff your work. With Readymag, design handoffs are absolutely stress-free: you can hand over websites to the stakeholder with a couple of clicks. The client will receive an email with the link to accept the project — that’s it! Just make sure your client has the subscription plan which provides all the features you’ve used.

Offer guidance to your client. The project is finished, but what about supporting the customer? Take time to create straightforward instructions and cover questions that might arise. If you’re already using Readymag, simply send them this handy client guide.

Sign up for beta testing to try new Readymag features before anyone else.

Join Readymag to design complex, interactive web pages right in your browser.

How to ensure seamless collaboration with clients was originally published in Readymag on Medium, where people are continuing the conversation by highlighting and responding to this story.

Renewing the Readymag Editor: the whats and whys behind the redesign

In a permanent state of change, Readymag has inevitably accumulated some surface and structural inconsistencies. Even a single improvement may lead to controversies in the other parts of the interface, which is partially normal for products as complex as Readymag. Sooner or later, all such products need a thorough refresh that encompasses the entire system.

The refreshed Readymag interface is more uniform and has a simpler structure. All panels are now at the surface layer, accessible in just one click. Nothing is hidden unless absolutely necessary. Although no changes were made to the widget settings and their properties, we’ve shuffled the position of ‘first level’ panels (Pages, Devices, Widgets, Grid&Guides, etc) and tweaked a few niceties along the way. These panels serve as the very first points of contact for newcomers exploring the Readymag Editor. They also pave the way to start using the tool smoothly.

So, let’s look at the most crucial UI changes up close and dig deeper into where they all came from.

Article credits: Stas Aki, product designer at Readymag

Left and right docks

The new Editor interface is symmetrical. As of now, it includes two docks: the left dock with ‘material’ stuff (pages, devices, and widgets) and the right dock with settings related to structure and planning (cursor modes, grid, project settings, and a set of learning resources).

With all the panels expanding from the docks at the bottom of the interface, Readymag is now especially convenient for those using it on iPad. Now they can access any control just with their fingers and won’t cover page content with their hands anymore.

Both docks have five buttons each. Like humans have 5 digits per hand.

The docks also resemble the front of a car with their symmetry.

‘Go to Profile’ button with the left thumb

The ‘Go to Profile’ button is now accessible in one click and placed intuitively at the left bottom corner where you would expect. In the previous version, it was only available after opening the Pages/Settings menu.

The left dock

As you see, we’ve split the Pages and Project Settings panels. Previously, both panels were merged into a single button that split into two on click. Now the Pages panel is on the left dock, the second tab counting from the left.

In the old version of the interface, the Page/Settings panel used to overlay the right side of the page. This meant some content might be covered. Now, this area is left clear during left dock interactions.

Devices (previously Viewports) remained in the left dock with a few visual tweaks.

The Layers panel also remained in the left dock without any changes.

The right dock

Blocks has been moved out of the Grid panel and turned into a brand new Modes menu, neighboring the Lock layout option.

As Guides&Grid settings have become more frequently used, we took them out of the Layers panel and added them to the top level of the right dock. They’re now available in just one click.

The most important change in the Project settings panel is that we moved the Viewer settings to Preview mode. Now, you can see all the viewing changes instantly on a published project. Export to PDF, HTML, and iFrame has also been moved to Preview mode.

‘Preview’ button with the right thumb

Down here on the right is the Preview button. According to Fitts’s law, the corner position is the most quickly accessed target on the screen. Consequently, it makes for more habitual usage.

So, now there is a strict left-to-right flow in the app: Back to Profile is on the left, while the Preview button is on the very right with a set of design tools in between.

Once the design is done, users can simply hit the corresponding button on the right to preview their project.

Viewer settings and the Export tab, as mentioned earlier, have been completely shifted into the Preview mode.

And a tiny pleasant detail: the icons in both docks are now animated on hover, which makes the interface feel more alive and responsive.

A human-centered interface

The idea of human hands with their ten fingers behind the user interface layout (Latin digiti meaning fingers) struck me. Perhaps, such a tool for handcrafting the web as Readymag has more claim to this association than any other design product. At least, I believe so.

We at Readymag hope you enjoy this fresh coat of paint for the Editor. As usual, we’re more than happy to hear your feedback at hello@readymag.com.

Subscribe to our newsletter to learn about our new features.

Want to try new features ahead of all? Become a beta tester.

Readymag Editor 3.0: the whats and whys behind the redesign was originally published in Readymag on Medium, where people are continuing the conversation by highlighting and responding to this story.

New permission level for text editors, separate viewing settings for mobile & desktop and flexible Hotspot: what we’ve done in the first half of 2022

In our 2022 mid-year wrap up, we will run you through changes to our viewer settings for Mobile and Desktop, Layout Locked mode, flexible Hotspot and default SSL for all projects. You’ll also notice a few small but important changes aimed to boost your workflow across the tool.

Leave composition unaffected while editing content

Update widgets without the risk of accidentally breaking your overall design by using the Layout locked mode: this permission level enables copywriters, marketers, business owners, and other non-designers to make changes safely. You can invite collaborators to work on your project in this role or switch to it yourself. Enabling Layout locked mode for yourself is possible on all Readymag plans. If you are on a Freelancer plan (available at $22.5 per month) or higher, you can invite collaborators to work in this role. Check our Help section for more details and give it a try!

Enable different viewer settings for mobile and desktop

Toggle navigation arrows, page counts, page menu and progressive images independently for the desktop, mobile and tablet layouts of your project — we’ve separated Viewer settings for the layout formats. For example, navigation arrows can be toggled on for the mobile version without being activated for desktop. This update is available for users on all plans.

Try flexible Hotspot for better UI in projects

Hotspot’s Tip element can be positioned independently of the Pin. The Tip (which can be text or image) is displayed when the Pin is activated (by click or hover). This update makes Hotspot great for pop-ups, burger menus and more complex UI elements. It is available for users on all plans.

Embed Radymag projects everywhere using iframe

With an iframe embed you can easily customize the structure of any existing website by seamlessly inserting Readymag projects. Whether it was made using Readymag, a different website builder or coded entirely from scratch. The feature is available for users on Business and Extra plans, as well as the archived Professional plan.

Get SSL by default

To meet tightening web security requirements, all new Readymag projects now get SSL certificates switched on by default. Older websites that have never had SSL receive them automatically as soon as their first new visitor arrives.

Make your content more accessible

Visually-impaired and blind users may use screen readers to surf the web. Alt tags help these apps read the content properly. Now, in addition to Picture, alt tags can be added to both the Slideshow and Shape widgets. The text limit has been doubled to 280 symbols. Project menus, sharing buttons and navigation arrows are now set with aria labels. Jump into our accessibility checklist to make sure you’re ready for a diverse audience.

Send projects with custom fonts right off

Transfer Readymag projects and project collections with the custom fonts they contain right off: recipients no longer need to upload the custom fonts manually. This update streamlines workflow for designers who create client projects in their accounts. You can use this new feature on a Freelancer plan and higher.

Upload video backgrounds directly to Readymag

Upload your background videos directly to Readymag instead of Youtube and Vimeo. Embedding videos hosted on these services to the background has stopped working due to their inner restriction policies.

Easily center widgets on the screen

Align any single widget to the center of the screen — the controls in the Align panel now allow it. If you activate Snap (in the Grid&Guides with the ‘S’ shortcut), you can align any widget to the screen center using guides. If you select a group of widgets, enabling the same control will align the widgets in relation to each other.

Create projects with default Scale layout

You don’t have to worry anymore about how your Readymag projects adapt to different screens. The Scale Layout is feature, which adjusts the designs to different devices sizes, is now activated by default.

Subscribe to our newsletter to learn about our new features.

Want to try new features ahead of all? Become a beta tester.

New permission level for text editors, separate viewing settings for mobile & desktop and flexible… was originally published in Readymag on Medium, where people are continuing the conversation by highlighting and responding to this story.