How I Create My Logo and Build My Website From Scratch

In my last post, I described my history in becoming a passionate gamer and how finally I become an indie game developer. Right after I make a decision to produce a video game of my own, I started an attempt to create my company logo. Somehow the process of finding the logo idea is not that difficult for me. I actually use the first idea that came out from my head without making any big change throughout the process. My inspiration came from an image of a famous chess master, Garry Kasparov, who holds his two hands in his head with a deep-thinking expression. I make the first sketch in my tablet using the stylus. I even have an idea of the customized font that I will use. I plan to build it from scratch using the shape and cutting tools in Adobe Illustrator. At first my company name will be Dathinka (which roughly means ‘The Thinker’ that relates to my logo idea), but later on I found out that a website with that name has been taken already (update on January 14th, 2017: it seems the website name has become available again now). I finally change it to Dhathinka, relating it to my name. For me, a game is an art. So I decided to use the term art into my logo name. That is how I came up with the name of Dhathinka Art. It is kind of saying “Dha(niel) think(s) (of) a (video game) art”. After checking its domain name availability, i quickly acquired it from a web hosting company. I decide it to use Go Daddy. I haven’t had any problems with their services up until now.

I go through countless process of trial and errors in picking color and changing minor shape of my logo until I get it right. I tried to get feedbacks of my logo design from my friends and family. I took into account only a few of them. I believe that we need to stick to what we feel is right. Once I feel satisfied with the final version, I deploy it on different social media pages such as facebook page, google plus page, twitter and so on. They requires different image size for the profile image, cover image, etc. It is easy to find the guidelines in the internet. Since I make almost all of my design in Adobe Illustrator it is easy for me to resize the exported image (in PNG image file format)  without sacrificing its quality. In the process, I also found that when facebook page resize my logo into a small thumbnail, it got blurry and looks really bad. After trial and errors, I found that the main problem lies in the design construction of my logo. In order to have a clear thumbnail picture in low to mid-resolution display device, you need to make a logo with simple and clean-cut shapes. I decided to make a sub-logo to represent my company profile picture. The logo is the word ‘d’ constructed using five ‘pentagram’ color that I use in my main logo. Later on, this logo is also useful for making ‘favicon’ of my website. Favicon is a very small logo that you see on the browser’s tabbed document interface next to the page’s title.

I first learn the basic of HTML and CSS by doing all the exercises in Codecademy website.  I have also done most of the JavaScript part. It seems that all the exercises are very basic, but it is more than enough for you to understand a more complex ones. My philosophy in learning how to program a code is to ‘dive into it’ as much as we can. We do not need to understand every little details of the program language. You just need to pick up the basics and go from there to build a code that will solve your problem. Even if at first your code is not efficient and elegant, you have learned something from it. Along the way, you will become proficient with more and more experience. Since I already have Adobe Master Collection CS6, at first I tried to build my website from scratch by using Adobe Dreamweaver. The process came really slow since there are many details that need to be done.

One of my friends told me that nowadays you do not need to do it like that. He said I can pick up a CMS program such as WordPress, Joomla, etc and customized the website design afterward. After comparing different CMS program, I decided  to use WordPress that is very popular. I quickly learn on how to use a ‘child theme‘ using WordPress. A child theme is used to modify, or add functionality of the parent theme without directly change the code of the parent theme. I picked up a theme that suit the vision of my website design and go from there. It was the free twenty thirteen theme by WordPress. I customized the website design by writing a modified CSS and adding several HTML and PHP code in my child theme. One of the challenge in modifying the CSS code of the theme is in learning the construction design of the parent theme. I print out the CSS code and try to understand almost all of its meaning. Once you get a hang of it, modifying it to visualize your own design is very easy. After I feel satisfied with the website design, I started putting contents to it. As you can see, making your own small company logo and website are not as complex as you would have imagined it. With efforts and perseverance, everything will turn up just fine.