Alicja’s thoughts

HTML/CSS zines

2019-08-29T00:00:00-07:00

I wanted to share my handwritten notes on Haskell and other things I’m learning in a more accessible way (previously, I was using Notability). I also wanted to create a pure Node.js setup for generating static websites, without using any external libraries, just for fun.

This project uses:

HTML for content
CSS for styling
a custom hand-drawn font
Node.js for generating output HTML

Some zines I created with this setup:

Unblocking my writing

2019-03-26T20:12:00-07:00

I often self-identify as a person who reads and writes a lot. Yet it has been challenging to write for the past few months. I wanted to explore why, as my actions were not aligned with my goals.

I realized I have blocked myself. Yes, writing is hard, especially writing and sharing, but that has not stopped me before. It was the workflow I dreaded that was blocking me.

When your blog build takes 140 seconds

I have used Jekyll for my previous website. I kept using it for nearly 3 years without any refactoring or reorganizing the content. The site grew heavy with posts from different contexts, translations, buildup of old projects, abandoned ideas, drafts, and what-ifs. I wrote a few clunky Ruby plugins to use in specific contexts. I was not finding them useful anymore, but I did find it hard to part with them.

The legacy code and content caused the build time to slowly creep up from a few seconds to well over two minutes. Each time I saw a typo or wanted to play around with content, I could either do it directly in developer tools or wait for the files to rebuild. Not even --watch helped here much, as I bloated my build script with unnecessary workload.

This made it incredibly difficult to work with, as I was unable to see my changes quickly and iterate on them. Every blog post became a painful process.

I only mustered to go through it once every few days. Then every few weeks. Finally even a few months was not enough time to push myself to work with it.

I just need a blog

I like the idea of using the simplest possible tool for the job. I have a website mostly to share blog posts and update my resume from time to time. I misattributed my Jekyll issues to Jekyll, without looking too closely at the thousands of lines of legacy code hidden neatly in numerous directories, and I was reluctant to try it again.

Once every few months I’d try a new shiny idea for creating a workflow - Hakyll, Gatsby, WordPress. I even considered hosting Jupyter notebooks as I found it easier to work in them and review my work in chunks. But each of those ideas caused more problems than it offered solutions, as I wanted my website to be simple, static, and fast.

I revisited Jekyll, but instead of trying to refactor, I started with a clean slate. I took a few days to create a design without any unnecessary assets (turns out pretty much all of them were unnecessary). I coded the blog in a few hours. Migrated the posts I cared about and installed two plugins I needed. Then put back everything else I wanted to preserve as static assets, as to not bloat my build process.

It takes 3.5 seconds now.

Those Jupyter notebooks sound pretty neat tho

For some reason, Jupyter notebooks still sounded appealing. It turns out the CSS blog posts I’ve been painstakingly managing with huge CSS files and handcrafted code chunks in Markdown can be created without much friction using Jupyter display built-ins.

Lo and behold, I can iterate on my ideas and write CSS notes, saving each step of the way while exploring (more on that soon). No more “fork CodePen every time something fun happens”. No more “I just need to render this thing in a browser”. Open a notebook, explore, and export to Markdown.

If you find a workflow painful, there might be something to it

I was writing off issues with my workflow as laziness and lack of creativity. I was obviously not determined enough to write - otherwise all the issues with long build times, slow website and handcrafted CSS would not stop me. If I was a real blogger…

Turns out I’m still a blogger at heart and my discomfort was valid. Now I can’t wait to hack away on CSS and generate ideas that I’ll be able to quickly share. Granted, I have not figured out a way to work on fewer ideas at the same time yet. Hopefully it’s a sign of excitement.

On passing for a native speaker

2019-03-02T13:51:00-08:00

I came to realize how many thoughts I have around my English accent. It’s a mix of pride and anxiety, and this is discomfort I’m not going to get away from anytime soon.

Why is this important?

Okay, so you’re bragging, right? You want to show off and tell everyone how good your accent is. That you’re passing for a native speaker and it is about your ego.

I keep struggling with that idea, because, yes, part of it is pride in my skill level and effort I put into learning it. Part if it is lack of comfort, and awareness of my privilege.

I have small interactions around my accent daily. They are usually positive for me and well-meaning from others. I enjoy them, but they leave me with a sense of uneasiness every so often. And digging into that uneasiness seems worth the effort.

Working as a software engineer

English is the lingua franca of software engineering, as it is in many other fields. I need it for my day to day work. I needed it even when I was living in Poland. All my code is in English. All my comments are in English. Most of my writing is in English because of the value of sharing ideas and the high cost of translating it. Translating is like rewriting your thoughts in a different voice that somehow needs to still feel like you.

To keep up to date with technology, grow our skills and work as engineers, we need English.

Perception of certain vernaculars

It is my understanding that on average people perceive certain vernaculars of English as more-than. There are many dimensions to it: more sophisticated, more fluent, more appropriate. When I was learning English, the vernacular was a somewhat posh Oxbridge version of British English. My grammar, my vocabulary, and my perception of the right accent come from my impressions of learning the language in Poland.

Certain vernaculars are undesirable - one of them is Eastern European. To speak with an Eastern European accent is to bring about all our heritage into the room. Suddenly, there is a faint whiff of vodka and a meaty sound of rolling Rs. The consonants are hard and thick, the vowels are sparse and flat. The possible topics of conversation shift to hardship, folklore, and drinking.

To speak with an Eastern European accent is to label oneself as the other. That other is often perceived as less-than.

Living in an English speaking country

I look like I could be from anywhere in Europe with my generic European face. My accent and vocabulary put me somewhere close to Northern and Western Europe. My job puts me firmly in the category of professionals.

When someone asks where I’m from, they bring about curiousness. They expect to hear about a land full of happy blond people speaking a fast-paced Germanic language. They have expectations around good social security systems and an outstanding education.

Polish.

But what do you mean Polish? Surely, you’re second generation? Or you moved somewhere as a child? Maybe you had special training and loads of effort put into this? Maybe you’re Polish in an American, second-generation your-grandma-was-Polish way?

Polish.

Oh, but you don’t sound Polish! How can it be? I’d never think that! Your English is so good! Where did you learn the accent? Did you study abroad? Have you been in Canada long?

They’re impressed, they’re amazed, they’re speechless. They grab bits and pieces from their patchy pattern of Eastern European cultures. So, you drink a lot of vodka? And pierogi, yes, I love pierogi!

Why can’t people just learn an accent?

Say, how many languages do you speak, with how many different accents?

Did you learn them at home or at school?

How many opportunities do you have to practice your second, third, fourth language, on a day-to-day basis?

How much time do you have to learn anything, with all this stuff going on in your life?

What’s an accent? How do you make those sounds you make when you speak your language?

Why does it bother me so much?

Because learning a language is different than many other ways of being the other. It is not something you were born with. It is something you can change up to a point. It is not something you can just learn, you need to find your way into it.

But it’s not perceived as such by an average native English speaker I interact with. They usually assume it’s about effort. If you don’t have the right accent, you didn’t work hard enough. You should take an English class and work on it.

I can pass for a native speaker. I can experience the same level of comfort in English as I do in Polish. My skill level, my abilities, myself - they’re not judged based on my accent. And that’s comfort that many people don’t have.

It’s hard to watch movies where accents are being used as a shorthand. Person A has this accent, therefore person A has these characteristics. This is how you should perceive person A. If person A is Eastern European, they’re probably a blue-collar worker who drinks too much. Or an unhappy homo sovieticus struggling with the post-communist reality. Or a beautiful woman who was saved from being Eastern European by marrying a rich Westerner.

It’s hard to see people shift their language and behaviour ever so slightly when they hear a hint of otherness. They assume things, they adjust things, they adapt to what they expect an interaction to be like.

It’s hard not to say the obvious things. If I have an accent, that means I learned a second language. You have no idea how my thoughts sound. I have to translate them for you and translation makes me speak with somebody else’s voice.

I am not one of you. I am the other.

I am not the other. I am one of you.

Retrieving drawings from Notability

2019-02-27T21:47:00-08:00

I use Notability a lot to take notes while learning and during meetings. It’s fast and comfortable, allowing me to jot down my ideas on the fly. One caveat of taking notes in this way is that they’re not easily exportable in an editable format, so I can’t reuse them in other contexts (e.g. when creating diagrams to explain ideas).

I poked around and found a blog post by Julia Evans on reverse engineering the Notability format, which was a great starting point. My use case is a bit different, since I didn’t want to put my notes in the format - I wanted to get them out of it. It also seems that Notability has changed formats since then, but the initial ideas turned very helpful.

Getting the data

I grabbed a note on curl and unzipped the file. I tried to use Julia’s code directly, but quickly realized the data is in a slightly different format. To decode it, I needed to use biplist, for binary plist files.

import biplist

note = './Blog_post/Session.plist'

try:
    plist = biplist.readPlist(note)
except e:
    print('Not a readable plist: ', e)

I then wanted to see what’s in the data and poke around a bit to see what I’m working with.

I needed to retrieve:

data points for each point in the drawing
some information on connecting the points
some information on figuring out where a shape/curve ends
colors and for the curves

I listed out the keys and decided $objects looks promising. I followed with a highly scientific method of going through the keys of $objects one by one to find something useful. An element that looked promising had keys curvespoints (sounds like the coordinates of the points) and curvescolors (might be the colors) in it, so it looked like I hit the spot.

print(plist.keys())
> dict_keys(['$version', '$objects', '$archiver', '$top'])
print(plist['$objects'][8].keys())
> dict_keys(['eventTokens', 'curvesnumpoints', 'numfractionalwidths', 'curveswidth', 'curvesfractionalwidths', '$class', 'curvescolors', 'curvespoints', 'numpoints', 'numcurves'])

Drawing initial data

I grabbed the points and unpacked them with struct. To make sure I have the right data, I plotted them.

import struct
import matplotlib.pyplot as plt

# directly using Julia's method with changing the result to int first 
# also had to add some changes to process other formats than float (for colors etc.)
def unpack_struct(string, fmt, size):
    return struct.unpack('{num}{format}'.format(num=int(len(string)/size), format=fmt), string)

drawings = plist['$objects'][8]
points = unpack_struct(drawings['curvespoints'], 'f', 4)

# let's see a scatterplot of the points
xs = points[0::2]
ys = points[1::2]

plt.figure(figsize=(60,25))
plt.ylim(max(ys), min(ys))
plt.scatter(xs, ys)

Yay! This looks like my drawing.

Now I just need to connect the curves, but how do I know when a shape ends? Maybe some value goes to 0? Let’s check the x values for the points.

[x for x in xs if x <= 0]
> []

Hmm, it doesn’t seem like it. Let’s draw a shape by manually adjusting the range and see where it ends.

# after a few manual adjustments, this seems to be the shape
xs2 = xs[0:5036]
ys2 = ys[0:5036]

plt.ylim(max(ys2), min(ys2))
plt.scatter(xs2, ys2)

# let's like at what's next to the end of the shape
x0 = xs[5035:5040]
y0 = ys[5035:5040]

print(x0, y0)
> (64.0300064086914, 121.70161437988281, 123.13665771484375, 124.48757934570312, 126.95639038085938) (74.58029174804688, 46.82347106933594, 46.80168151855469, 46.90596008300781, 46.85621643066406)

Okay, let’s look at some other keys in $objects. The curvesnumpoints seems like it can have some information on the number of points in each curve.

num_points = unpack_struct(drawings['curvesnumpoints'], 'i', 4)
num_points[0:10]
> (40, 85, 7, 4, 4, 16, 430, 1066, 379, 2713)

Let’s draw a curve! It looks like the second curve starts at 40 and ends at 125 (40 + 85).

x1 = xs[40:125]
y1 = ys[40:125]

plt.ylim(max(y1), min(y1))
plt.plot(x1, y1)

Awesome! Looking at the keys in $objects, the useful ones seem to be:

curvespoints - the coordinates for each point
curvesnumpoints - the lengths for curves (described as the number of points in a curve)
curveswidth - the widths of curves
curvescolors - the colors of curves, in rgba

With all that, I should be able to recreate the drawing.

Putting it all together

To recreate the original drawing, for every element in curvespoints I need to:

take the number of points in curvesnumpoints
draw a line through them with the color specified in curvescolors and a width from cruveswidth

plt.figure(figsize=(60,25))
plt.ylim(max(ys), min(ys))
plt.xlim(min(xs), max(xs))

current_x = 0
current_y = 0

points = unpack_struct(drawings['curvespoints'], 'f', 4)
num_points = unpack_struct(drawings['curvesnumpoints'], 'i', 4)
widths = unpack_struct(drawings['curveswidth'], 'f', 4)
colors = unpack_struct(drawings['curvescolors'], 'B', 1)

# matplotlib uses fractions, so let's rerange colors
colors_reranged = [x / 255 for x in colors]
colors_list = [colors_reranged[i:i+4] for i in range(0, len(colors), 4)]

type(list(num_points))
for i, curve in enumerate(num_points):
    max_x = current_x + curve
    max_y = current_y + curve
    plt.plot(xs[current_x:max_x], ys[current_y:max_y], color=colors_list[i], linewidth=10*widths[i])
    current_x = max_x
    current_y = max_y

I wrote a short script for retrieving drawings from Notability, you can grab it from this gist. It also has a copy of a Jupyter notebook I wrote this post in.

Gender fluid in a gendered language

2018-08-08T12:18:00-07:00

I changed the default English pronoun I use for other people to they some time ago. For a long time I thought it impossible to incorporate a similar approach in my native language, until I realized I’ve been doing it all along.

Polish is a gendered language. Table is male, floor is female, while chair is of a third gender, similar to English it. I’m not sure there is logic behind these assignments, but the fact is it’s very hard to speak Polish without a gender in mind. Every noun, pronoun, verb and adjective have a gender and there is no agreed on way of being gender neutral, without using it that is somewhat dismissive or derogatory (at least when used for adults).

Yet I have been gender fluid in Polish all my life without fully realizing it. My first name, Alicja, I use with female grammar forms. My second name, Karolina, I usually abbreviate to the male Karol, and use it with male forms. It’s seamless for my loved ones, as they use both (though they usually have a preference, with my mom using my first name and my grandparents using Karol exclusively, unless they’re mad at me).

Thinking back, it’s suprising how easy it has been to use both my names without focusing on gender. If anyone had an issue with it, I’d just refer to it as a “personal choice” or a “family tradition”.

I added a correction to this post as it was potentially confusing. I use both she and they pronouns in English for myself. Feel free to refer to me however feels right for you.

The curb cut effect of the Internet

2018-07-27T18:52:00-07:00

I recently listened to an episode of the 99% Invisible podcast on curb cuts and it made me pause to appreciate some of the curb cuts I experienced. One with the most profound impact on my life is the Internet.

Without it I wouldn’t be where I am. I wouldn’t have learned English well enough to be confident and fluent without all those hours binge-watching Bones and Grey’s Anatomy. I wouldn’t reignite my interest in programming without free MOOCs and open-source communities. I would never go to New York to join the Recurse Center, I wouldn’t go to meetups to make friends and find jobs, I finally wouldn’t meet my partner and move to Canada.

The Internet gave me opportunities and support I needed to take advantage of them. A space to explore, experiment and embarrass myself. A way to learn resilience and build up confidence by overcoming challenges, making mistakes and getting back on my feet.

It’s often a mixed bag, yet I can’t be anything but grateful.

Browsing in grayscale

2018-07-20T12:50:00-07:00

I started exploring my browsing habits to better understand why certain websites grab my attention. As aware of UX dark patterns as I am, I grew tired of mindfully noticing when they want to “nudge” me into certain behaviors with vibrant colors and obscuring others by making them less visually appealing.

While I was trying to unsubscribe from yet another unwanted email marketing list, chasing for the “unsubscribe” link hidden in plain sight, I noticed that grayscale works well for techincally showing the information required of advertisers, yet obscuring it among the flashy colorful action calls.

My previous attempt at decreasing the time I spend on social media was leveraging Stylus to hide certain parts of websites, e.g. related videos and comments on YouTube. It manages user styles, with a simple checkbox menu for enabling and disabling them.

Since I use FireFox, switching to grayscale is fairly simple. I created a new stylesheet that applies to all websites and added a single property for body. (you can also add a filter in other browsers)

body {
  filter: grayscale(100%);
}

It’s easy to turn it off when I want to. And it encouraged me to fix minor annoyances on some websites. I stopped using AdBlock when I switched to FireFox and I now use targeted display: none on elements I find distracting.

A minor caveat of the extension is that it doesn’t work on all websites, because it’s a WebExtension. I found that it only makes me appreciate it more when I encouter a page that doesn’t apply my user styles.

One more surprising issue I encountered is that the grayscale filter sometimes breaks scrolling. I tried debugging it on my website, thinking it might be caused by some legacy code or a hidden Stylus property, but adding it directly to the body also changed scrolling behavior.

Improving my English

2018-06-29T22:30:00-07:00

I encountered a thread in a community group chat asking for advice on guiding someone through improving English skills. Some of the resources and ideas I shared were helpful, so I decided to write a longer blog post about it.

First, a few disclaimers:

I didn’t self-learn English - I had about 15 years of mandatory school courses and a fair share of instruction outside of the classroom
I had a heavy Polish accent until the second year of my undergrad, which disappeared by getting more comfortable with the language
I went to an English-speaking country for the first time when I was 25, so all my training was in Poland

These are some ideas that worked for me in the hope that they could be a good starting point for others to inspire their own explorations. Learning a language is like acquiring any other skill, it requires commitment and deliberate practice, with a lot of fun along the way.

Setting goals

It gets harder to set a goal the more comfortable one is with the language. Initially, my goal was to get good grades in school. Then I wanted to learn better English so I could read faster, because I had to sometimes rewatch parts of the subtitled movies.

Somebody spoiled the ending of the last Harry Potter book for me, because I was struggling through it for more than a week. Somebody else got praise for their beautiful accent and I was embarrassed about my hard Polish vowels. My Guild Wars team needed a translator for international runs. I wanted to go to New York for a few months to join a community of programmers.

My goals inflated as my confidence grew and I still see many ways I could improve: writing more American English, so my sentences are not Polish-long; flattening my too posh accent so people don’t think I’m trying to sound this way; using tenses and conditionals the way a native speaker would.

No matter where you are on your journey, try to set a goal that’s slightly outside of your reach and will motivate you to improve.

Switching to English

English classes were useful for learning the basics and making it a habit through homework and tests. What helped me get from being able to use the language to thinking in it was what I would do outside of the classroom.

I made sure to be surrounded by English through:

switching all my devices to English, especially since the Polish translations were often awkward
making sure to watch, read and listen only in English - binge watching “Grey’s Anatomy”, “Bones” and “Supernatural” helped, especially with English subtitles on and watching closely how people move their mouths when they speak, trying to mimic it
having conversations with myself - one of my friends phrased it better as having “mini presentations”, I’d sit in front of a mirror and answer questions in imaginary conversations out loud, talking about anything of interest (especially being one of the protagonists in a TV series I was hooked on)
memorizing standard sentences and learning how to replace certain words (a bit like Duolingo) - “I am eating cake” can easily become “I am eating pancakes”
learning about Polish grammar through English and Arabic studies - learning about the grammar of your own language or another language you know well helps with understanding grammar in general
writing more, even if I never posted it - especially short stories and programming tutorials, which require good structure and flow
interviewing people - talking to people on a daily basis while living in Poland, writing notes for the interviews and often rewatching parts of the recordings (which is super uncomfortable, but helpful)
moving to an English speaking country - I notice my brain being in English-mode more than half the time, even when I’m alone

Noticing patterns

English is notoriously irregular and hard to grasp. The pronunciation rules are often misleading, words have more synonyms than one could imagine and one can use it in a way that’s very hard to understand. (like this nightmare of a language test from South Korea)

When I encounter something new, I try to think of a pattern that can be a more general rule:

I noticed I’m using tenses differently than a native speaker would - one of my friends made me more mindful of the fact I use present perfect (have + past verb) more often; it was a revelation to me that the -ing continuous tense is more natural for native speakers than the present simple form
I realized at some point that in English you want to have something in front of your noun 99% of the time, be it a particle or an article, which is not something we even have a notion of in Polish
my pronunciation improved when I started noting down words someone would be confused about, e.g. I often pronounce spent and spend the same way, because in Polish we de-vocalize the last consonant and I was unknowingly doing it in other languages

Language learning is full of little “a-ha” moments and constant improvement. Looking for explanations and being more mindful of underlying patterns can help you get more comfortable.

Asking for feedback

It is hard and can initially be embarrassing to ask for feedback, especially if you’re surrounded by people who are more comfortable with English.

Ask someone you’d be comfortable getting feedback from

While still in school, your teacher is probably the best person to ask. It becomes tricky when you don’t have an instructor and have to ask your friends or coworkers to help you out. Make sure you’d be comfortable with them talking about your mistakes.
Understand what kind of feedback you need

Before I took my IELTS last year, I’d never think I needed to work on my speaking skills, but when I got a lower than expected score, I realized I was overconfident. Assess your skills as objectively as you can and think about which areas you’d need most help with. A good rule of thumb is looking for something you’re uncomfortable with. If you don’t like writing, maybe it’s time to start a blog and encourage yourself to write more.
Set ground rules

Helpful feedback is specific and focused on the issue - your English. Your friend might be a native speaker, a language teacher or just more comfortable with the language. For some reason they know something you don’t and you have a chance to learn from them. That’s great! Making mistakes is how you learn.

Some ideas that worked for me:

feedback is given in a way that’s not interrupting the flow of the conversation - otherwise it can make you feel uncomfortable
it should be focused on one aspect at a time - usually something that stands out the most, making the meaning unclear or inappropriate, e.g. don’t correct me on my particles if the tense I’m using makes everything confusing
the person giving feedback is open to explaining the issue in more detail - it’s not helpful to say “this is not right, you should say something different”

Example of good feedback

a friend, after I finished what I wanted to say: “By the way, you said you’d like feedback on your English. I noticed you are saying polish when you mean Polish. They sound nearly the same, but the difference is in the vowel - one is a long vowel.”

me, intrigued: “What’s this long vowel thing you are talking about? I have never heard about it!”

followed by a nice conversation about vowels in English

What was good about it:

they stated they’re giving me feedback I requested before to set up the context
they gave a specific example of what I was saying
they explained the more general context of the error
they were open to having a conversation afterwards, during which I learned more about the general rules and how native speakers perceive vowels in English

Example of bad feedback

during a longer conversation about buying books for learning Arabic

a classmate: “Well, I would never pronounce it [ah-ray-bick].”

me, after an awkward silence: “Uhm.”

What was bad about it:

they were only pointing out the mistake, not giving the wider context
they focused on setting themselves up as more knowledgeable
they made me uncomfortable, because it was meant to be a joke on my behalf

Life-long learning

Learning a language is hard at first, but as I got more comfortable, it became more natural and pleasurable. It’s not only useful, especially when you need it in a professional context, but also fun!

If you ever get discouraged, keep in mind that:

native speakers have the advantage of being surrounded by the language and thinking in it all the time - how comfortable are you in your mother language?
native speakers make mistakes - they omit particles, they use the wrong tense, they misremember a phrasal verb; I don’t know how many times I said wziąść in Polish even though the appropriate form is wziąć and I have been corrected on it countless times
the fact that you have a foreign accent and sometimes make mistakes means you are learning - and that’s amazing!

Resources

Most of the resources I use are in English, be it programming language documentation or news sites. There are a few I tend to use more often, but this is a subjective mix of links that I enjoy that might be useful.

Reading blogs and watching vlogs about English is fun and helpful:

Grammar Girl
Merriam-Webster vlog
Grammarist
engVid (Jade has the best lessons!)

General tools for longer reads:

Readlang is a browser extension you can use for websites that helps you look up words quickly
Pocket for saving longer articles
using a tablet/ebook reader to read ebooks, especially using the built-in dictionaries to not interrupt your reading (try to understand the context of the word before you look it up)

Writing tools:

Hemingway a writing app, it’s hard to adjust not only your understanding of the grammar, but also your style to English, e.g. shorter sentences, more repetitiveness, simpler structures
Grammarly for checking your grammar on the fly

Podcasts (any podcasting app will do):

Invisibilia - talking about invisible things around us and science
Note to Self - a podcast about our relationship with technology
Rationally Speaking - rationality and skepticism
Science For The People - various science
Hidden Brain - mostly focused on science of human behavior

GDPR compliance

2018-05-25T15:30:00-07:00

As the General Data Protection Regulation compliance deadline has arrived today, I have removed all tracking scripts from my website.

I did it to protect myself, as being self-employed implies I’m a legal entity. I never collected any data beyond user visits, be it personal information or passwords.

I have only used two tracking scripts, both external:

Google Analytics for getting info on the website traffic - removed completely
Recurse Center script for referrals - I removed the script and now only use a static link for referrals (even the RC logo animation is in pure CSS)

Since this website is being hosted on GitHub pages, some data is still being tracked by GitHub servers for providing the service. I don’t have control over what GitHub might be tracking, but I don’t provide any additional data to them. Any data GitHub might have on users after visiting this website is what they willfully provide by browsing the Internet.

I might add a new tracking script to this website in the future, after I make sure I understand if and how Google Analytics is compliant with GDPR.

Conf & Coffee 2018 - designing and printing name badges

2018-04-22T16:13:00-07:00

We recently organized Conf & Coffee 2018 in Vancouver, BC, and one of the bigger tasks we had to take care of was designing and printing our conference badges. A conference is all about people - people who come there to learn, meet new people and have a good time. We wanted to make it easier for them and create useable badges.

Name badges are often bulky and awkward, but they serve a purpose. A well-designed badge can help start a conversation - and get back to it, even if you suddenly forget someone’s name. We also wanted the attendees to be able to easily find speakers and organizers in the crowd. It also helped with initial registration, giving people a reason to come to the registration desk and chat with us.

We had a few requirements in mind before printing the badges:

making sure the name is clearly visible and readable at a distance
making the prints sturdy enough to be usable for a 2-day conference
color-coding them for easy recognition of attendees, speakers and organizers
having an adjustable lanyard, so that people of all heights can feel comfortable wearing them
encouraging everyone to use their badges as they please - add interests, stickers, preferred pronouns etc.

Design and prints

We had a wonderful initial design for the badge created by Alanna Munro and worked from there by creating two more color options - we ended up using the original purple color scheme for speakers, adding a peach color for attendees and a green one for organizers.

We then took the SVG files and prepared them for printing, working closely with a wonderful local print shop. They helped us with:

creating an image in Adobe Illustrator - the original design by Alanna was created in Illustrator, but since the person mostly working with the designs had more experince with Sketch, we decided to use it for brainstorming
adding bleed - we had a sense that we’re going to need bleed, but initially added it in the SVG projects rather than using the Illustrator tooling for adding it, it turns out it takes about 20 seconds to add if you know how
making sure everything aligns just right, especially the names and the speaker talk information - a few people had longer names and non-English characters in them, some of our speakers had two talks during the conference
adjusting the colors for printing - we had a color palette defined in HEX that looked great on a screen, but needed a splash of cyan to make it more vivid in print
choosing the right paper - uncoated heavy white cardstock (130lb), as we wanted people to write on them
cutting the prints and drilling holes - it might seem obvious, but we were initially a bit worried we might need to cut and drill the holes on our own, turns out it’s something a print shop will gladly do

We got the initial prints and stress-tested them throroughly - writing on them, putting them under pouring water, pulling at the lanyard etc. - and they were perfect for our needs. We were very lucky with the print shop service, as they were responsive and quick to adjust the order to our needs.

Lanyards

We decided to use twine for our adjustable lanyards. Initially, we wanted to use regular packaging twine, but it was too brittle, so we used white cotton twine instead - one spool was enough for all our badges.

To attach the lanyards we needed:

big enough holes in badges on each side (0.125in) - this also allowed the badges to not turn too much, if properly adjusted
two pieces of twine (one for each side)
a sliding knot to connect the two pieces - we used a fisherman’s knot

It sounds simple, but keep in mind we had about 130 badges with pre-printed names and a bunch of blanks in case of last-minute cancellations/swaps. It took two people and two episodes of Westworld - I don’t think you could do it with one person and four episodes, because without my partner helping me I’d probably call all the other organizers for an emergency twine party.

Lessons learned

Design - it’s not easy

If you are not a designer, don’t assume you can make the badges look good on your own. Our badges looked great, but most of it was thanks to a simple and adjustable design that we could then reuse. The back side of the badges had a simple table for names and Twitter handles, because we didn’t have a clue as to what else we could put there that would look good and be usable (or, at least, not look terribly out of place). Make sure to work with a designer.
Timing the prints - you need last-minute adjustments

We decided to print the badges after finalizing the ticket sales, but we didn’t expect too many swaps. That turned out to be an overly optimistic assumption, as many people suddenly remembered about the conference a few days before it and were asking about last minute changes. We ended up ordering additional blank badges, so that people could write their own names on them.
Informing attendees at registration - especially on adjustable lanyards

Yes, we had the adjustable lanyards - but we didn’t do a great job explaining it at the registration desk and some of our attendees were initially very uncomfortable. We could also encourage people more to draw on them and use them, as, even though we had a prop just for that, not many people felt encouraged to do so. The back of the badge with a table to put names and Twitter handles in was not used by most of the attendees, so maybe we could figure out a way to better use it in the future.
Adjustable lanyards are appreciated - but we could improve the process of attaching them

We heard positive feedback about the lanyards, especially from attendees that usually have some issues with awkward placement of conference badges, which was great and we’ll definitely make them again. One thing we could improve is making sure more people could attach them and the process is less time-consuming.
Conference logo - you ain’t gonna need it

We didn’t use the conference logo on the badges, as our design looked great without it. Our attendees knew what conference they are attending and we couldn’t think of a way of putting our logo on the badge without overshadowing the more important bids.

All about the people

A conference takes a lot of work and, although most of the tasks are simple and repeatable, it gets surprisingly hard and tiresome. It was a great experience, especially since I got to work with a wonderful group of people.

Thank you Brooke, Rose, Manil, Darryl, Nichole and Steve for welcoming me as a co-organizer!

Thank you Gavin, Paulina, Robert, Wendy, Andrea, Bernadette, Stephen and Daruvin for volunteering and making this conference happen!