Dessy Chongarova

If you were to teach someone web design, how would you start your first lesson? How would you end it? I had the opportunity to ask myself these questions the other day, when I started teaching my friend Maggie HTML & CSS. There wasn’t any planning involved, so here’s what I came up with on the fly.

Start with Content

In my experience, theory and explanations don’t mean a thing if you can’t see them applied to something that you care about. So I asked Maggie to think of something she would like to put on the web. Maybe her own personal website or a blog? I used Aral Balkan’s Content Out Web approach as a reference.

Maggie decided to make a cooking blog. I advised her to think of ways to make the topic more specific and unique so that she could differentiate and keep her own interest. She thought of making it strictly for cakes or connecting it somehow with music. I already saw her getting worried about what it was going to be. So I told her that she would be improving it over time and that she could totally change her mind at any point.

For now, just open Notepad, write a title and a one sentence intro, and save the file as index.html. Now drag this file in a browser and see how it looks. There, you’ve got your first web page and it didn’t heart!

Understanding HTML Tags

Creating an html file and previewing it in a browser gave Maggie a taste of the magic in a matter of seconds. I now had her attention and it was time to explain what html actually does. I described it as a way to tell the browser what is what on a web page. We marked up our h1 and p, we added a strong, an em and a link to a YouTube video. (At this point Maggie asked if we could make YouTube load in a new browser tab!) We added some inline styles and we created a second html file.

Linking a Stylesheet and Making the HTML Valid

Having two html files with similar structure gave me a reason to introduce external stylesheets. For that we needed to add , and to our pages. I took the time to explain typographically correct quotes and dashes and this led us to the need of specifying the encoding. We added a doctype and a title.

Version Control and Publishing on the Web

I wanted to finish the first lesson with Maggie uploading her work somewhere public. This would totally make things real. When something is out there and you could easily share it, you just want to make it better as fast as you can.

For hosting I thought the most lightweight and fast solution would be to use GitHub Pages. But we couldn’t do this without explaining version control. Up until now we hadn’t talked about or downloaded any tools that she didn’t already have on her PC. But now I asked her to open a GitHub account and download their Git client for Windows.

She then created a repository and pushed her site. We now had the added value of GitHub issues which I later used to give her homework.

The concept of Responsive Design

Now that Maggie’s site was online, we opened it on her phone. I then asked her to add in the head of the html documents and talked a bit about RWD.


She asked me how she could track visits and I guided her through setting up Google Analytics.

For Next Time

  • Write your first blog post—again, don’t overthink it.
  • Download and install Atom—a fancy text editor from GitHub that is free.
  • Watch Chris Coiyer’s video tutorial on the basics of HTML&CSS—it’s time to make friends with this guy!

Looking Forward to Lesson 2

So for next lesson we’ll already have some content to work with and we’ll be doing that in a decent code editor. I think we’ll take a step back and make some sketches to figure out the content structure and the navigation of the website.

We’ll also take a look at the competition, see how food blogs look and what they contain. We’ll view source and we’ll play with the Inspector. I guess we’ll be embedding images and we’ll talk some more about responsive design.

Since I’m self-taught in what I do for a living, I recently came to a point where I felt the need for deeper and more structured learning. So I took this summer off to combine my two big passions—design and travel. I flew 7400 km to attend the Summer Intensive in Interaction Design at the School of Visual Arts in NYC.

It’s been great to study the theory behind things I’ve been doing intuitively. The teachers have been so inspiring and supportive. The classes I took helped me gain confidence in what I do and the way I do it. I believe that thanks to that I’ll become much better in selling user-centred design to co-workers and clients.

Here are some specific lessons that I learned from each of the amazing teachers whose classes I took.

  1. Tell a story (Drew Cogbill, Mobile UX Design)

    Not only your design should be telling a story, but you should be telling a story about your design.

    In our class number 2 of 4 with Drew we had to stand in front of the class and present our concept and wireframes for a mobile app. Our theme was “food”,  so inspired by the sharing economy, I came up with “What’s for Lunch”. It’s a food delivery service that connects people who work in offices and want to order healthy lunch with people who cook at home.

    When giving me feedback Drew didn’t focus on my app IA and navigation. Instead he said he liked how I was calling the cooks “Chefs” and how I had a separate tab for presenting them. I see this as my design telling a story where those people have a leading role. Drew also said that I could do a better job in telling the story of my design. Who could be the people that would use “What’s for Lunch”? What are their specific problems that the app is aiming to solve. So I continued my work for the class with this in mind.

    What's for Lunch Design Process

  2. Work on your sketching skills (Carla Diana, The Practice of Interaction Design) 

    Your sketches could be a means to communicate your thought process and ideas.

    I’ve always used pen & paper to think and talk to myself but I’ve never intended my scribbles and doodles to be shown to other people. I do clean diagrams and wireframes for that purpose. As part of our group project deliverables for Carla’s class, we had to present a story board of our product in use (scenario thumbnails). I can’t draw, but I’d heard so many times the teachers say that sketches weren’t supposed to be perfect.

    Apparently my sticky figures were so obnoxious that Carla’s first reaction to our presentation was (paraphrasing): “Those sketches were supposed to look better, weren’t they?” I’ve intended to work on my drawing skills for ages and Carla’s remark was the kick in the butt that I needed.


  3. Keep asking “Why?” (Jodi Leo, Research Methods in Interaction Design)

    When interviewing people and observing users, you don’t want to leave any statement hanging, so you ask “Why?” all the time. When you’re presenting your work be ready to answer that same question at any moment.

    I was first to present on our team during the final class with Jodi. She interrupted me after my first sentence with the question “Why?”. I was already thinking about what I wanted to say next, so I answered with something from the top of my head and it sounded like an excuse. (This led to another important lesson: “Don’t apologise”.)

    I’ve noticed that a lot of what I do or say is led by intuition. But once I think deeper about it, I am usually able to back it up with logical reasoning. This extra thinking helps me when I have to communicate my ideas. But it also puts them in a different perspective for myself and stimulates me to elaborate even further. So trust your guts but also think about the reasoning behind your decisions. Then be confident.

    Presentation & critique during our final Research class with Jodi Leo at SVA's Summer Intensive in IxD

The startup I’ve been working at for more than a year is shutting down. Even so, this has been the best work-related experience I’ve had so far. As part of the product team, I learned about defining and developing an MVP. I also found out how exciting user testing is for me and I accustomed myself to iterative design.

I spent my time working with smart and talented people who were also great to hang out with. Thanks to their recommendations I got a fantastic offer for a new job straight away. It’s a Producer position at an established digital agency that mainly works with UK clients and start-ups. I’ll be responsible for scoping projects and I’ll be working on the IA and UX design of websites and apps. I see this as a great opportunity to work at a more strategic level, to deepen my UX design skills and to gain diverse experience.

Back to School

Meanwhile, I’ve been feeling the need for a more formal learning for a while. Being self-taught as a web designer, I’ve never had any real-life teachers and mentors in that field. So I’ve been researching masters degrees around the world. But I quickly realised that I couldn’t afford to take two years off at the moment.

Then I found out about the Summer Intensive in Interaction Design at the School of Visual Arts in NYC. I also have family in the States and I’ve been wanting to visit for a long time. Moreover a family friend in Boston invited me to her wedding in July. Everything clicked, so I decided to spend the summer across the Atlantic.

Let’s Collaborate!

Luckily, the company that offered me a job in Sofia was flexible enough and we agreed that I would start work on the 1st of August. So until then I’ll be travelling, I’ll be going to school and I’ll be working on my personal project. I’m also open to collaborations and freelance gigs so don’t hesitate to get in touch if you think we could work together.

As far as I’m concerned, the problem of bookmarking the web isn’t solved yet. I keep starring sites in Chrome, trying to put them in logical folders, although searching and browsing them later is a pain and I never do it. Pocket is great for saving articles to read later offline, but I also use it for double bookmarking entire sites that I find useful and it sucks. I just don’t think of searching there, when I need to find something specific.

I sometimes use Evernote and Pinterest for bookmarking while I’m researching a specific topic and it’s kind of OK. But I don’t have a place to simply store my favourite websites.

So I decided to start a simple list of resources that I’ve been using recently for design reference, research and learning. As this list grows, I’ll be thinking of a better way to present it.

UX and UI Patterns
A curated collection of the finer details of design, updated every day.
A running idea list for good user interfaces.
А collection of specific designs and patterns of user interaction.

A Pocket Guide to master every day’s typographic adventures.
A practical guide to web typography.
A comprehensive article on choosing the right type by Jessica Hische.
An archive of typography, indexed by typeface, format, and industry.

Patterns, resources and news for creating responsive web experiences.
Starter’s Guide to iOS Design
Articles on user experience, web design, and e-commerce.

iOS Design Patterns
An archive of comparable user flows, searchable by tasks or apps.
A kinetic pattern library that captures and preserves delightful iOS animations.
A curated library of iPhone and iPad user interface patterns.
Mobile Apps Design Patterns.
Categorised and searchable mobile design patterns library.

The best new & interesting interaction design, curated by Animade.
A collection of inspirational websites using media queries and responsive web design.
Browse examples of good websites by topic.

A constantly growing searchable collection of icons and symbols.

If you’re switching from writing plain CSS to using SASS (and Compass) and you’re doing WordPress theme development, there are a couple of pain points that you’ll come across.

1) You need a style.css file at the top level of your WordPress theme folder.
2) That file should start with a comment.

Let’s deal with the second point first, as it’s simply a matter of adding an exclamation mark to the opening comment of style.css like so:

If you don’t add the exclamation mark, the comment will be stripped off at compile and WordPress won’t recognise your theme.

Jumping back to the first problem, here is how the structure of a simplified WordPress theme folder looks like:


And here is the file structure of an example Compass project:


So if you put your SASS folder (and config.rg file) in your WordPress theme folder, it will compile inside a CSS folder at the same level and there’s no straightforward way to tell it to do so one level up. Luckily, there’s Chris Coyer to point out that you can add ruby code to your config.rb file and use it to move the style.css file one level up at compile.

So just add this snippet at the end of your config.rb and you’re all set up!

You can see this in action by exploring the WordPress theme for this site on GitHub.

  1. I got a new job

    I started the year with my first full time job as web designer. Best team ever, best boss ever, best process ever! Working on a digital product is totally for me. Getting user feedback fascinates me and the possibility to make things better and better with every iteration is very fulfilling. I learned SASS and got hooked on User Experience. I started using Git and stopped being afraid of the Terminal. We launched a private beta some days ago and now I can’t wait to work on a live product with real customers.

  2. I worked on side projects

    I started working on an app which will be fighting discrimination against minorities by letting people geotag offensive graffiti. Overpainting workshops will be organised as a result. I also did a couple of client websites and practised Responsive Web Design, SASS, WordPress Theme development and other skills that I otherwise might not use on my day job.

  3. I travelled

    In 2013 I visited Poland, Serbia, Turkey, Germany, Hungary, Israel and England!

    It was my first time in Istanbul (stayed in Kadıköy, fell in love with it!) and Berlin (not my type of city, but meeting Devendra Banhart on the street and seeing him play live was totally worth it!). Belgrade confirmed itself as a great party destination with awesome Couchsurfing hosts. Nick Cave and the Bad Seeds rocked at the Exit festival in Novi Sad.

    Warsaw in February is not the place to be (especially without warm boots), while Budapest is one of the most beautiful cities I’ve visited, with some of the best bars and cafes (particularly in the Jewish Neighbourhood). As for Tel Aviv, Jerusalem and the Negev desert, I should either say nothing or write a separate post!

    I visited my mom for Christmas and I was happy to share the London experience with Ivan.

    In 2014 we’re thinking about travelling to Morocco and Greece. Sicily has been a dream destination of mine for a while and I would also like to scuba dive again. Renewing my USA visa in order to travel to New York and visit family in Boston is also on the list.

  4. I stayed physically and mentally healthy

    I started the year with a one-month detoxication (no meat, no salt, no sugar, no gluten, no preservatives). Maybe the best outcome of this was that I had to cook for myself, which felt like taking care of myself. I also kept eating healthy after I finished the diet, but during the last months of the year things got a bit out of control.

    I kept trying running from time to time, but it still seems impossible to get hooked on. I was doing Yoga regularly, but I dislocated my shoulder in October and used that as an excuse to skip all kind of exercise for too long. I want to start this year with a well-balanced combination of healthy food regime and regular exercise and to finish it in a similar manner.

  5. I fell in love

Last year was the first time I made a New Year’s resolution. I was in the mountains on the 31st of December and I guess the fresh air took its part and provoked me to sit down for a while and look back over the 12 months that had passed.

Then I decided to take up one little thing that would make me feel better about myself. And try to accomplish it during the upcoming year. Committing to one thing only and focusing on that, meant that I wouldn’t feel overwhelmed by this whole resolution thing.

I chose to do two cycles of Sun Salutations every day. Preferably right after rolling out of bed. Then I got up and did two cycles of Sun Salutations.

I am happy that I’ve managed to stick up with this for the most part of the year. The biggest exception period was when I dislocated my arm a couple of months ago. Unfortunately I turned this into an excuse to break away from what had almost become a routine for much longer than necessary.

For this upcoming year I decided to commit to publishing one blog post each month. I’ll be writing about what I’m learning as a web designer and about whatever else comes to my mind. Bear with me to see how it goes and enter your email below if you want to be notified when I publish something new.