What Design Has Taught Me About Life

Since I started learning UX, I have been reading articles that end up in the same question: “Should UX designers learn to code?”...

5 lessons I learned coding my own UX portfolio

We asked eight designers to tell us about their favorite graphic design books. Here’s what they recommended.

10 graphic design books to sharpen your product design skills

<blockquote class="wp-block-quote"><p>I launched&nbsp;<a href="https://designerslack.community/" rel="noreferrer noopener" target="_blank">Designer Slack Communities</a>&nbsp;a while ago, aiming to help designers to connect with likeminded people. By sharing my website with the world, I’ve connected with so many designers. The whole experience is a first time for me, so I want to share my experience about how I built it.</p></blockquote>



<h2>What is Designer Slack Communities</h2>



<p><a rel="noreferrer noopener" href="https://designerslack.community/" target="_blank">Designer Slack Communities</a>&nbsp;is a website where I collect all the active Slack communities for designers. It’s aiming for designers who are looking to join more communities and connect with designers around the world.</p>



<p></p>



<h2>Why did I decide to build&nbsp;it</h2>



<p>A few weeks ago, I attended&nbsp;<a rel="noreferrer noopener" href="https://remotedesignweek.com/" target="_blank">Remote Designer Week</a>, organized by Design X. It was such a wonderful experience. During the time, I’ve slack-met a lot of designers and got introduced to a few more Slack communities. I enjoyed the sense of community, and many designers are looking to join different communities as well. I think it would be helpful if there is a list of Slack groups for designers to join. When I search for something similar on the internet, there are resources like this. But they are either not tailored to designers, or have expired links. So I decided to build a website to collect all the active Slack communities I can find.</p>



<p></p>



<hr class="wp-block-separator"/>



<p></p>



<h2>Gather information and&nbsp;design</h2>



<p>With the 20 active communities I gathered. I started to design the first version. I wanted to keep the design simple, but I also wanted to try something different this time. I’ve used too much soft shadow and pastel colour in my design work that I’m kind of tired of it. I chose to use bold borders and more vivid colours for this one. It makes the website more fun and delightful.</p>



<figure class="wp-block-image size-large"><img src="https://prototypr.io/wp-content/uploads/2020/05/1_oBUrj_iBWXqIguxtOJmO2g-1024x766.jpeg" alt="" class="wp-image-51966"/></figure>



<h2>Building</h2>



<p>With the design done, I started thinking about how do I want to build it. I could look into different CMS options and static website frameworks. It would take me weeks to learn them and make the website. If I wanted to add new features in the future, it would take even more time to figure it out. Then I remembered Webflow. Webflow is great at quickly building a website. Although it has its limitations, a single-page website like this would be the perfect use. Thanks to the power of the Webflow CMS, it only took me a couple of hours to implement my design. The CSS grid makes building a responsive list easy. It’s widely supported across modern browsers. So I would encourage everyone to use the CSS grid whenever you can.</p>



<figure class="wp-block-image size-large"><img src="https://prototypr.io/wp-content/uploads/2020/05/1_hLP4JCfin-xeo3NMaChmHQ-1024x624.jpeg" alt="" class="wp-image-51965"/></figure>



<p></p>



<h2>Launching</h2>



<p>After finishing the development, I post my website on various Slack groups and social media. I got a lot of positive response. People were adding me on LinkedIn and Twitter. They found this website is helpful as they were searching for similar resources. I also have people saying they were working on similar things and asking if I want to collaborate. It truly felt joyful as I created something that helped people. That’s the reason why I became a designer.&nbsp;</p>



<p>I’m also surprised by the connections I made. As an introvert and a non-native English speaker, I always find it hard to connect with people. Building a side project and sharing your work is an excellent way for people like me to establish networks.</p>



<p></p>



<h2>Keep improving</h2>



<p>Within a few days after the launch, I got over 50 new communities submitted. The list became rather long. A way to sort or search for communities would certainly help people to find what they want. Webflow doesn’t have this feature built-in, but I found a great tutorial on the Webflow Forum. It uses MixItUp 3 to do dynamic searches for CMS items. With few customizations I made, the feature is working great. Another alternative is Jetboost. It’s a paid service, but the setup process is straightforward. No js code required.<br><a rel="noreferrer noopener" href="https://forum.webflow.com/t/webflow-cms-mixitup-3-filter-sort-search-hash-url/96306" target="_blank">https://forum.webflow.com/t/webflow-cms-mixitup-3-filter-sort-search-hash-url/96306</a></p>



<p></p>



<p>I also added RSS to the website. I’m a huge fan of RSS. It’s a great way to let visitors receive updates without manually check the website every once in a while. Webflow makes adding RSS straightforward. You can use all the fields in your CMS to create the content in RSS and preview without opening a new tab.</p>



<figure class="wp-block-image size-large"><img src="https://prototypr.io/wp-content/uploads/2020/05/1_r-xAgSszYobi0emqd9aBaQ-791x1024.jpeg" alt="" class="wp-image-51967"/></figure>



<p></p>



<p>Someone suggested I should add social share buttons to lead more referral traffics. Thanks to the help of the Webflow community, it’s quite easy to do it. Wierperwebworks shared a project that makes this process simple as copy and paste.<br><a rel="noreferrer noopener" href="https://webflow.com/website/simple-social-share-buttons" target="_blank">https://webflow.com/website/simple-social-share-buttons</a></p>



<p></p>



<p>The last thing I did is to switch to Simple Analytics from Google Analytics. It’s a privacy-focused web analytics tool. It has all the essential metrics that are more than enough for me. Even though it’s not a free tool, it does feel relieved because I know it respects the privacy of my visitors.</p>



<figure class="wp-block-image size-large"><img src="https://prototypr.io/wp-content/uploads/2020/05/1_ZcCX-LvpifCemkqp7IJT_Q-975x1024.jpeg" alt="" class="wp-image-51968"/></figure>



<p></p>



<h2>Clone the&nbsp;project</h2>



<p>I’ve made this project available on the Webflow community. Everyone can view it, clone it, use it for your own project. I hope it can help other people, just like how I got help from the Webflow community.<br><br><a href="https://webflow.com/website/Designer-Slack-Communities" target="_blank" rel="noreferrer noopener">https://webflow.com/website/Designer-Slack-Communities</a></p>



<p></p>



<hr class="wp-block-separator"/>



<h2>Conclusion</h2>



<p>Building a side project is a fun process. You can get creative with it because it’s your project. I’m so humbled that I got connected with many people through this project. It may not give me any profit, but I do feel a sense of fulfillment by sharing my work and connecting with other designers. I hope this post can inspire you to make something small yourself. It doesn’t have to be the greatest idea ever. With tools like Webflow, it won’t take too much time to build it either. If you have any questions, please feel free to tag me on Twitter.</p>

How I use Webflow to build a side project to help designers connect

A Figma plugin that gives an emotional touch to your work.
How to use it?

1. Choose the frames you want to add cats to.
2. Launch the Hidden Kittens plugin.
3. And, voila! Kittens will appear in a random place of every selected frame.

Easy and fun!

Hidden Kittens

Create avatar illustrations in Sketch with this free library designed by <a href="https://twitter.com/pablostanley">Pablo Stanley</a>. Mix and match clothing, hair, emotions, accessories and colours.

Avataaars

Get top SaaS landing page examples! Browse hundreds of SaaS marketing pages, product interfaces and email flows on SaaSFrame.

Made by <a href="https://twitter.com/AntoineMilkoff/status/1263508298533347330">Antoine Milkoff</a>.

&nbsp;

SaaSFrame

<p><em><strong>How to find me at a party?</strong></em> </p>



<p>You normally don’t.&nbsp;But you can try the corner, mostly table for one, furthest from the crowd, maybe that girl who is constantly avoiding eye-contact or any possibilities for conversation. Sometimes though, I am that stranger who walks up to you and initiates conversations about your media consumption habit (very random, yeah?) or that girl who runs a co-creation workshop the other day. No, I am not writing a thriller, I am just describing myself as an introverted UX Designer.</p>



<p>If you google “careers for introverts”, “designer” would appear as a top hit, that is because introverts are perceived as more creative and more empathetic — which makes us great for the job. (Yay to my introverted gangs! ) However, I hate to break it to you, but the job also requires us to do the more of what appear to be extroverted stuff like conducting user interviews, usability tests, presentations, and facilitating workshops.</p>



<figure class="wp-block-image size-large"><img src="https://prototypr.io/wp-content/uploads/2020/05/Untitled_Artwork-3-1024x768.jpg" alt="A person anxiously speaking in front of a group of people" class="wp-image-51835"/></figure>



<p>So how do I, a proud introvert do the extrovert aspect of my User Experience Design job, in this case, facilitating workshops? (Spoiler: it is a constantly hard job)</p>



<p>Before you read further, here are some amazing resources and pep talk to get you interested in running a workshop if you are not invested already.</p>



<ul><li><a rel="noreferrer noopener" href="https://workshopper.com/how-to-get-promoted/" target="_blank">Running Workshops: The Secret Career-Boosting Superpower</a>&nbsp;(actually check out their whole website on workshops</li><li><a rel="noreferrer noopener" href="https://uxplanet.org/lightning-decision-jam-a-workshop-to-solve-any-problem-65bb42af41dc" target="_blank">Lightning Decision Jam: A Workshop to Solve Any Problem</a></li></ul>



<hr class="wp-block-separator"/>



<p></p>



<h2>Prep very very well</h2>



<p>Preparation is the key, and I meant both mentally and physically. Personally, I think it is better to be overly prepared than to show up blank, especially when you are doing something that scares you.&nbsp;My preparation is ranging from writing down the self-introduction script (yes, that is very scary for introverts to say “Hello, I am blah blah 😅...”) to do a mock presentation in front of the mirror. So, here are some of the preparation activities I have done prior to running a workshop.</p>



<h3>1- Have a goal</h3>



<p>First thing first,&nbsp;I am assuming you are running your workshop with a clear goal in mind, whether this is a&nbsp;Discovery Workshop — where you are just trying to identify the problem, creating a hypothesis, or a&nbsp;full Design Sprint — where you are building a prototype, or maybe just a quick&nbsp;Lightning Decision Jam to determine how to effectively run meetings. Regardless, you need to have a clear goal of what you want to achieve from the workshop.</p>



<p><em><span style="color:#4d2176" class="has-inline-color">This goal is an important motivation to get you to get out of your comfort zone and do these rather extroverted activities. The idea of running a workshop is already tiring, am I right?</span></em></p>



<p></p>



<figure class="wp-block-image size-large"><img src="https://prototypr.io/wp-content/uploads/2020/05/Untitled_Artwork-1024x768.jpg" alt="Person intensively focusing, bitting her pencil, and sitting in front of her computer." class="wp-image-51837"/></figure>



<h3>2- Have a detailed agenda — a customized one that tailored not only toward the problem but also toward yourself and your participants.</h3>



<p>Being prepared means knowing what you are going to do. What are the sessions about? Plan them down in detail. You definitely want to do some research prior to your workshop as well, to make sure you know as much as you can about the workshop you are running. While you are not expected to be the sole expert on the topic, you need to align ideas and do a lot of conclusions, so do as much research as you can.</p>



<p>As a facilitator, you are also a timekeeper ⏱ ⏲. So plan how long each session is going to be, given your current understanding of the problems and your participants' proactiveness and/or communication style.&nbsp;Some people really like to talk and elaborate on their ideas. Therefore,&nbsp;as a facilitator, even though you need to cut long discussion and get straight to the point, you also need to be aware of the group dynamics.</p>



<p><em><span style="color:#4d2176" class="has-inline-color">In addition, the most crucial thing is to be aware of your own energy.&nbsp;</span></em>Facilitating a workshop is very exhausted, and as an introvert, you get tired more easily in this context than other extroverted facilitators. So be aware of your energy. If the agenda is too cramped for you, consider spacing them out. It is better to be in full energy and concentrated for a two-day workshop, then be exhausted and space-out at a 9h day workshop.&nbsp;When you balance your energy well, you will get the most out of the workshop and the participants.&nbsp;</p>



<p><em><span style="color:#4d2176" class="has-inline-color">By giving the workshop an extra day or hours, you are also giving the participants enough time to digest the information, room for creativity, and room for mistakes.</span></em>&nbsp;A lot of time, the session you plan goes longer than you expected, simply because the problem you would form together as a group is more complicated than you have anticipated. Trust me that happens quite often, especially when it is your first time facilitating or it is the first time the participants are joining a design workshop like this.</p>



<p><span style="color:#4d2176" class="has-inline-color">Once you finish your agenda, don’t forget to send them to everyone!</span>&nbsp;Make sure to also include any sessions that the participants would like to do in advance as a form of homework. They would really appreciate you giving them extra time to prepare and excel during the session.&nbsp;If I am running a Design Sprint, I generally like to give participants a head up about the Lightning Demos, so if they would like they can do some internet search or light research to find inspirations prior to the session.</p>



<p></p>



<figure class="wp-block-image size-large"><img src="https://prototypr.io/wp-content/uploads/2020/05/Untitled_Artwork-4-1024x768.jpg" alt="Writing in note." class="wp-image-51838"/></figure>



<h3>3- Prepare your scripts &amp; maybe some <a href="https://sprintstories.com/23-facilitation-tips-for-design-sprints-34d876aa5317">jokes </a>😂</h3>



<p>You know your agenda, why need a script? It is not like you are giving a speech!</p>



<p>Never think you are too prepared. As introverts, we know too well the awkward moments when words get stuck in our throats and we would stand there and freeze. It is not that we don’t know what to say, but we are just not very good at expressing words in front of a large group of people (and yes if it is more than two, it is a large group). This is where a script comes in handy. You may not use it the whole time but it is a good back up plan.&nbsp;By writing scripts, it also helps you to formulate your ideas well. I usually write my scripts for self-introduction, for the agenda of the workshop as well as for introductions to specific sessions — of course leaving rooms for spontaneous thoughts and pivoting as well.</p>



<p>A good self-introduction goes a long way. This is where you make the first impression. You want to sound confident yet friendly because everyone is here to work together to solve that one problem.</p>



<p>Jokes also come in handy. It helps to lighten up the mood of the room, and also help the participants to be able to express their ideas without feeling judgmental. The participants have to block their schedule, ignore their emails to be in the room joining your workshop. It can get very stressful. Laughter, therefore, is very much preferred.<span style="color:#0071a1" class="has-inline-color">&nbsp;</span><span style="color:#4d2176" class="has-inline-color">Jokes also help you look relaxed as well. You maybe a bit freaked out inside, but nobody needs to know.</span></p>



<h3 id="4fe1">4- Have a good rest</h3>



<p>A good-night sleep prior to the workshop is very crucial, simply because you need to maximize your energy usage. I know that the anxiety of facilitating the workshop would keep you up all night. To avoid this, stop preparing or thinking about the workshop at least a couple of hours before bed.</p>



<p></p>



<hr class="wp-block-separator"/>



<p></p>



<figure class="wp-block-image size-large"><img src="https://prototypr.io/wp-content/uploads/2020/05/Untitled_Artwork-5-1024x768.jpg" alt="Person speaks confidently in front of a group. " class="wp-image-51876"/></figure>



<h2>Be confident &amp; own it</h2>



<p>Yes! So you have done all the preparation. And today is the day? Are you ready? Not really, yeah? That okay, it’s normal.&nbsp;You just have to look confident, wear your go-to warrior yet comfortable outfits, some pep talks before you leave your house and yep, you are going to do great! Be optimistic and don’t forget your coffee.</p>



<h3>1- Set the stage</h3>



<p>It is very crucial to set the stage right from the beginning.</p>



<ul><li><strong>Set the rules from the start</strong> — from no devices during the sessions to no judgment during ideations.&nbsp;So, everyone is not going to be surprised or be mad when you ask them to put their devices away. Also, people get self-conscious when they are the only ones who seem to be breaking the rules.</li><li><strong>Mention that you are going to do a lot of talking today.</strong>&nbsp;It can be a bit weird to say that, but it is a good way to let everyone knows that despite your actual job’s position, today you are the facilitator.</li><li><strong><a href="https://sprintstories.com/23-facilitation-tips-for-design-sprints-34d876aa5317">Ask permission to do your job.</a>&nbsp;</strong>Mention from the start that during the workshop, you may have to stop some of the discussions that are off the topic or taken too long.&nbsp;<em>This is not just to let everyone knows you are just doing your job, and not being disrespectful, but also helps ease your guilt as an introverted agreeable human being.</em></li></ul>



<p></p>



<figure class="wp-block-image size-large"><img src="https://prototypr.io/wp-content/uploads/2020/05/Untitled_Artwork-6-1024x768.jpg" alt="Good looking meal :)" class="wp-image-51877"/></figure>



<h3>2- You don’t have to be the extrovert the whole time</h3>



<p>Yes, the whole facilitating workshop thing is very extroverted. I know you are really going out of your own self to do this. But you don’t have to be extroverted the whole time. As mentioned,&nbsp;it is very important to be aware of your own energy level. Break time and lunch break are your time.&nbsp;You don’t have to be chatty during these breaks. You can choose to eat lunch alone or be quiet the whole lunch if that means regaining your energy to continue running the workshop in the afternoon.&nbsp;If you don’t want to be rude, you can let everyone knows that this is how you energize yourself.</p>



<p></p>



<h3>3- Ask for feedback</h3>



<p>Asking for feedback is scary but very beneficial. You should ask for feedback before each break. This is to let you know how the participants think about the workshop, either to reassure you are doing a good job or that you need to adjust your agenda. Because it is before the break, you can take the break time to readjust your agenda accordingly if necessary.</p>



<h3>4- Be forgiving of others and especially yourself</h3>



<p>We should go into the workshop with confidence and a positive mindset. But of course, everything is not going to be smooth. You may encounter that the participants are not proactive, or the decision-makers seem to be indecisive; or you, yourself don’t seem to be doing a good job of explaining what needs to be done in each section. Mistakes happen and that is okay.&nbsp;Be forgiving of the participants if they don’t seem to be paying attention to the workshop or don’t seem to be proactive. These participants may need extra instructions or extra attention from you.</p>



<p><span style="color:#4d2176" class="has-inline-color"><strong>Most importantly be forgiving of yourself</strong>.</span> I&nbsp;have had enough bad workshop experiences that I can tell you with confidence that sometimes the workshop just doesn’t work well.&nbsp;Maybe you didn’t establish trust earlier with the participants or they are just not interested in the workshop in the first place. While some of these pitfalls could have been prevented before the workshop starts, only with experience can you sense what needed to be done.&nbsp;So, you just have to do it!&nbsp;Practice makes perfect, the more you do it, the more you confidence you get.</p>



<hr class="wp-block-separator"/>



<p>I suggest you start small, maybe do a small Lightning Decision Jam with your closed group of co-workers, or shadow someone in your organization who are running design workshops. Trust me, you will never feel ready. You just have to give it a try, and if it doesn’t work out well, try a couple more times after that.</p>



<hr class="wp-block-separator"/>



<p></p>



<p></p>



<p><em><span class="has-inline-color has-very-dark-gray-color">Thank you so much for reading this article. I am writing this mainly based on my personal experiences. I am still learning and experimenting with different workshop techniques. Feel free to leave your feedback or any questions. Would also appreciate it if you share your experiences as well.</span></em></p>

Introverted and designer: how I facilitate workshops

Managing Marketing and Partnerships @ Prototypr.io 💎 
Artist @ mema. 🎹 
Giving birth to Femme Discos 🍑 (women in music community, education hub, label)


Sofia Marques

Marketing and Partnerships Manager at Prototypr.io