Making of Shiagi

January 8, 2012 12:46 am

Hello, my name is Dan and I am an engineer, web designer, and the editor-in-chief of Shiagi.

Shiagi (shi·a·gi) is a premier web magazine that launched winter 2011 featuring the latest
articles on technology, cars, lifestyle, humor, beauty, food, fashion, design, and much more with a touch of humor, lightheartedness, and simplicity.

Part 1: The Concept

As an avid blog reader I found that many blogs did not meet my needs, they were too hyper focused on a particular topic that I had to search about ten different sites just to get all of my daily feed; autoblog for cars, canibeat for more cars, engadget for technology, kineda for modern fashion and entertainment, and the list goes on. I wanted to create a single site that I and several other people sharing the same interest could go on to get their daily feed.

In the beginning the site was tailored mainly towards the male audience, with cars, technology, video games, and manly topics, but as I began to think more I noticed that some of these topics are liked by women also ( my girlfriend likes cars also =] ) and many more topics are liked by both genders (i.e. food). So the site was planned to be themed; articles would have separate colors depending on their target audience.

Part 2: The Design Process

The Name
Thinking of a name for the website was the most difficult task in development, simply said: the good names were taken or the domain was already registered with a blank page… (bastards).

Here are a few names we scrapped along the process:
hydrollama
gaollama
llynea
kyocea
monoko
dokbokii (sounds like food edit: it is food lol…)
luminara
luniera
daenae
electrobear
illiana
kosorou

As you can obviously tell, we were getting either bored or tired as the names began to be more and more absurd.
The name shiagi was born out of sheer luck, when asked why I was working on this project the best phrase I could respond with was for “shits and giggles”. SHIts And GIggles, get it now? Awesome

The Logo:
Logos should essentially contain your entire site and business model within a single image. We wanted a logo that could convey how modern and simple our site was, and I especially wanted a logo that would look cool on my car.

Inspiration:

Logo Drafts:

Current Logo: 

Site Design & Layout:
I wanted the site to be simplistic, easy to read, and modern. The site’s layout was influenced by modern e-portfolios of artists and design studios, instead of listing articles in a ordinary cluttered list like most blogs, we chose to contain them in individual blocks that would give the site a more modern and simple feel as opposed to the blogs you see all over the place now.

Since I am bad with colors (read: very bad) originally the site was to have originally a white background with dark grey text, however in this layout the colors blended together too easily and nothing really popped out.

When the color scheme was reversed, white text with a dark grey background, it was deemed too strong and would hurt the eyes. After several drafts, I took what people liked the best from each, combined them, and mixed in some blue.

Part 3: The Coding

The possibility of custom coding the entire site’s blogging framework in PHP was an option at all times during the coding process, however the wordpress framework proved to be a much more easier and powerful solution. WordPress is a free, powerful, and open source solution for almost any project.
Coding began with the Starker’s theme for wordpress, this theme is a barebones naked theme of wordpress that only contains the bare minimum of a theme. No styling code to begin with meant that every part of the theme had to be custom coded. The homepage features a custom wordpress loop is used to separate the featured post from the regular ones, as well as meta tags to differentiate the gender for the css. The rest of the site is the sum of php code pulling up the necessary data or generating the html, and css styling the outputted code.

The first issue arose when I somehow messed up the .htc file and the www.shiagi.com and shiagi.com address were linking to two separate pages, this issue was solved only after wiping the server and two hours of googling code (hurray… >_>).
Aside from some coding issues, most of the time spent was on fine tuning the colors, location, and minor features of the site.

Conclusion:

I hate coding and colors.

Coding a website or anything for that matter is a very tedious process, one single bracket or line can mess up a code consisting of a thousand lines, or the code doesn’t play very nicely depending on what browser is used.

Enjoy the site!
-Dan