/ Visual Design 👀

Welcoming the digital world into the Year of the Dog


People usually work on their New Year's resolution at the end of the year ready for January. Hong Kongers, however, have another chance to make resolutions if they miss their chance in December. Hong Konger, myself included, also celebrate the Lunar New Year around February. Therefore, it is not too late to share my resolution in the Year of the Dog with you.

Six years ago, I left Hong Kong and entered a world where I was surrounded by Mandarin. Today, everybody is talking about how technology and globalisation are reforming every industry. This year, I decided to prepare myself for this unpredictable transformation. I pushed myself further by going to another world that is surrounded by English. I continued to push myself before the Lunar New Year and joined 100 Shapes. I wanted to stretch my arms, flex my muscles, and dive into a place that I haven't yet explored - the digital design world.

My professional background focused on branding identity and print design. I had limited experience working on user interface, but here at 100 Shapes, I am expected to work closely with Developers and User Experience Designers. My skills in building a visual design system and helping brands to communicate visually will help the presentation of a digital product. When it comes to the execution and realisation, however, I still have lots to learn.

My very first task, to warm myself up in the digital design world, is to design a tech blog for ITV. This is what I have learned:

Understand the tools that your client is using
When you work on print design, you can use any kind of method to produce; you can try as many materials as you can to fulfill your concept as long as it is within the budget and the ability of the printer. When it comes to digital design, before you start, you need to check with the developers or your client which kind of tools they use in order to know the limitations. They might be using an existing product and your job as a visual designer will be to work solely on the surface of the product and not the core of the functionality. Therefore, you should frequently check with your developers when you work on the design so that you know you are not making something that their tools can't support.

Don't focus on Sketch
It is a good habit for a graphic designer to perfect every detail of the design; adjusting spaces between 0.1-0.5pt for types and modifying pixel by pixel for every graphic. However, it will take you forever to make digital product go lives if you work this way. Simply speaking, it is a waste of time because details don't matter in the beginning.

I was thrilled when the developer told me that he could finish building the website in just one day. It turned out, however, that he meant building the website without the details. He would instead gather all the elements into the HTML/CSS and set the rules of style between them. For example, when paragraph 1, 3, 5 are set to use the same style: they are all in colour A, you can change all of them together by turning the colour A to B. (Works like setting style in InDesign). Then, you can make the changes to the details and ensure that it not only looks good but also works well on every device. The most satisfying thing is, you can see the result right away when the developer clicks on the magic tool - the Reload button. This button ensures everything is changed, realised and saved.

SEO - the bridge between your design and the physical world
When the website comes to life, you'd like to expose it to people in the physical world. I have learned a powerful keyword - SEO, Search Engine Optimisation. Search engines help people find website based on words they type into the search bar. It is important then that header 1 and 2 are used wisely. Just appearing in the search is not enough, you got to appear high up on the ranking or you run the risk of disappearing into the black hole of the internet. Aside from having a memorable and clear header, there are many ways to get a higher ranking; by improving the user experience of browsing a website and creating better traffic.

After starting this short-term project, I am ready to work on a digital product with a bigger system. I am sure there will be a lot more for me to digest on my way into the digital world and I am ready. Isn't it exciting to welcome the New Year, the Year of the Dog? It is already so full of knowledge and collaboration and it has only just begun. I hope I will continue to share my learnings in digital design. Happy Lunar New Year, Everyone!

P.S. I'm more of a cat person 😛