Apr 9, 2008  •  In Thursday Geek-isms

Hump Day Hook-Ups

I’ve been reading so many interesting things this past week that it was quite difficult to choose just ten…so I decided to be a bad girl and upped it to twelve. Enjoy!

  1. Keep It Simple, Stupid: Why Gadgets Should Have Less Features, Not More, Wired: Gadget Lab. Hear, hear! Exactly what I’ve been advocating for the past decade.
  2. Isiah Thomas’s New York Knicks Are the Worst Team in the History of Professional Sports, New York Magazine. At first I was angered. Then I was sad. Now I’m optimistic. Because at this point, there really isn’t anywhere to go but up.
  3. Texans Build World’s Most Powerful Laser, Wired: Science. Lasers. (Smile) POWERFUL lasers. (Goofy grin) Sharks with frickin’ laser beams attached to their heads! (Evil laughter) Okay, so that last part was unnecessary. But this is still pretty geekalicious news.
  4. Cheap Chinese Electronics May Not Be So Cheap Anymore, Gizmodo. I always said China will take over the world some day. (Why else would I be marrying a Chinese dude?) Can you imagine how powerful China would be if their electronics reach the status of those made in Japan?
  5. And This Is How You Do a Loft, Ikea Hacker. One of the best designed and well-utilized Ikea hacks I’ve seen in a while. Oh Ikea, how I heart thee. God bless the Swedes.
  6. 10 Cool Gadgets You Can’t Get Here, Slashdot. Sometimes I really hate living in the US.
  7. GTA IV ‘better than all the hype suggests’ according to first person to complete the game, Joystiq. I had been intrigued by the newest GTA ever since it was announced and stirred up some good controversy. According to this review, this particular GTA “‘craps on all the others’ in the franchise.”
  8. First Look at Renovated Madison Square Garden, Curbed. I’m not sure how I feel about the renovations since my office is right at Penn Plaza and dodging the construction work and noise will be a major PITA. However, MSG is due for a facelift and hey, maybe a new look is sign for a new (improved) team (Knicks)?
  9. Martha Stewart for 1-800 Flowers, Brooklyn Bride. Although I’m not much of a fan for flowers, I have to admit that these arrangements are gorgeous. Especially the first one. I love you, Martha! You my girl!
  10. Japanese Creative Packaging Design Solutions to Ugly Barcodes, Boing Boing. Once again, ADEB (Asians Do Everything Better).
  11. Miss USA’ Marketers: Watch This Pageant Cuz Pretty Chicks Are Idiots! Jezebel. With pageant ratings taking a dive in the past few years, the forces behind Miss USA have decided to go another way with their marketing efforts. Hilarious!
  12. Dead Woman Buried With Cell Phone Allegedly Sends Texts to Husband, Gizmodo. What a great idea! When I die, please bury me with my cell phone AND laptop. I shall continue to text and blog from the beyond.
Apr 7, 2008  •  In Art/Design, Fonts, Geek

Fonts & Web Design

In my last post, I talked about the power of a typeface and the impact it can have on your audience.

Today, I will discuss the role and proper usage of fonts in web design.

Let’s start with the basics. Fonts can be divided into two categories: serif and sans serif. To put it simply, serif fonts have little tails at each character’s points, while sans serif fonts do not have these extra marks (“sans” is the French word for “without”).

Here, you can see a serif font (Georgia) next to a sans serif font (Verdana):

Believe it or not, there has been much research and debate on the two type categories, but the general consensus seems to indicate:

  1. When viewing the document on-screen, sans serif fonts are easier to read (especially in small sizes) due to the effects of anti-aliasing.
  2. When viewing the document in print, serif fonts are better.
  3. Serif fonts are preferred in large formats (print and online) or when emphasizing text because it visually breaks apart each character.
  4. While I wholeheartedly agree with all three points, there’s a fourth I’d like to add, a point from my perspective:

  5. Serif fonts tend to “look” more serious

So what does this mean?

If you want your content to have a serious, business-like tone, set it in a serif font…but make sure the type is large enough to read easily.

Many designers would scoff at this advice, as we are taught never to use serif fonts for the main copy of a website. However, in my personal opinion, serif fonts can have a great impact when used correctly.

Now, let’s move on to the use of fonts in web design.

I have a love-hate relationship with fonts when designing a web page because there are so many fonts I would love to use (and I would have a glorious time choosing each one!)…but I’m restricted by the rules garnering web-safe fonts. This means that if the user does not have that particular font installed on their computer, they will only see the text in the default font set by the web browser.

You can see the (sadly) short list of web-safe fonts here.

There are three primary ways to work around this problem.

The first: convert your text into images. See the “Geek in Heels” at the top of this page? The font I used is an obscure type that most viewers would not have on their computers…so I’ve converted it into an image.

The downside to this method is obvious: while this can be useful when creating headers, menus and such, it just isn’t practical for large copies of text. Or with site with dynamic content. Or content that is frequently updated, such as a blog.

The second method is to embed the typeface within the document via PDF or Flash. With either formats, the typeface is loaded with the document so the visual rendering of the font is not lost. However, this method can also be impractical for the same reasons as the first.

The third method isn’t so much of a solution as it is a workaround via the use of font family stacks in CSS.

Here is an example of font stacking in CSS:

font-family: StoneInformal, Palatino Linotype, Book Antiqua, Palatino, serif;

This gives the browser an order in which the fonts should be displayed. In other words, the browser will first check to see if the user’s computer has StoneInformal installed. If not, it will then go onto Palatino Linotype, then Book Antiqua, etc.

By stacking the fonts with similar-looking fonts that are more common, you can at least guarantee that what the user sees bears some resemblance to what you intended.

That’s it for my tutorial on fonts and how to use them in web design. I tried my best to KISS (keep it simple, stupid) but I’m sure I got a bit carried away as this is a topic I find fascinating. Please let me know if you have any questions or comments!

You may also like:

Apr 5, 2008  •  In Art/Design, Fonts, Geek, Logos/Branding

The Power of a Typeface

This week’s NYTimes had an interesting OpEd titled To the Letter Born, discussing the impact that branding, especially the typeface Gotham, may have on Barack Obama’s campaign for the presidency.

For this piece, Stephen Heller interviews a branding expert named Brian Collins who explains:

…there’s an oxymoronic quality to Gotham, which is why I think it’s become so popular. It has a blunt, geometric simplicity, which usually makes words feel cold and analytical (like Univers), but it also feels warm. It’s substantial yet friendly. Up-to-date yet familiar. That’s a tough hat trick.

Collins goes on to display the word “Change” in three different typefaces:

Put the word “change” in Comic Sans and the idea feels lightweight and silly. Place it in Times Roman and it feels self-important. In Gotham, it feels just right. Inspiring, not threatening. In the end, typography makes a real difference when it delivers words and ideas that are relevant to people.

This piece naturally intrigued my designer self for two reasons. The first was due to my job: one of my main responsibilities during the first year of my current position was to implement the company’s new, updated logo and carry out the branding and stylistic guidance associated with it. Thus I am quite familiar with the power of branding and the importance of a consistent typeface.

The second reason is because I’m a font freak.

I love the power and impact of typefaces. I love how different fonts evoke certain moods. I relish the visual impact they have on marketing. I am a lover of written words and to me, a typeface that matches the mood of the message brings the final polish and an extra finesse that cannot be conjured by words alone.

Naturally I have many, many different fonts on my computer and I treasure each and every one of them. I even typed them all out for easy viewing…here is page 1 of 6:

(Yes, you don’t have to tell me…I do have OCD tendencies and this is a prime example.)

Whenever I have a design project on hand I pore over these pages in search for the perfect font. My obsession with fonts has come to a point where I can identify certain typefaces used in advertisements, signs, etc.

However, this obsession does have its drawbacks if you are a web designer. In my next post, I will talk about using fonts for your website: the two main categories of fonts; choosing the best font for your needs; and the limitations on web-based fonts, and the best ways to get around this problem.

You may also like:

Apr 4, 2008  •  In Geek, Shopping

There’s No Place Like 127.0.0.1

Many years back I discovered a wonderful online store called ThinkGeek.com. I have ordered many items since then but my mind always lingered on the very first item that caught my attention: the There’s No Place Like 127.0.0.1 Doormat.

(If you’re not a geek like me and don’t understand what the mat says, go read http://www.tech-faq.com/127.0.0.1.shtml).

I always vowed that when I get my own place I would prominently display this mat at my front door. (And is it just a coincidence that my birthday numbers are 127? I think not.)

Now, after having closed the condo and all the repairs done, I’ve slowly started to move in. I’m not quite living there yet, but my mind immediately thought back to this doormat.

I ordered it a few days ago and it arrived last night. 🙂

Welcome to geekdom, my friends.

You may also like:

Apr 4, 2008  •  In Geek, Tutorials

Google Reader, Part 2

If you haven’t already done so, please read Google Reader, Part 1.

Google Reader is fairly simple to use. Here’s a screenshot of my G-Reader homepage:

An explanation to the numbered features:

  1. All items. This tells you how many unread feeds you have.
  2. Starred items. With G-Reader, you can “Star” certain feeds that may be of particular interest for you so that you can easily locate them in the future.
  3. Trends. This takes you to your Trends Page, which I will discuss later.
  4. Your shared items. G-Reader allows you to “share” items which will then generate a feed of its own (each user gets a unique RSS URL). You can then share this customized RSS feed of your favorite items with your friends.
  5. Friends’ shared items. Just as you can share your items, your friends can share their favorite items too. This is a great way to find out about new blogs…tell me if you use this function and I’ll add you as a friend!
  6. Your subscriptions. Notice that I have the “Show: updated” option turned on at top, so this list only shows the new, unread feeds. You can choose to “Show: all” if you desire, and although I choose note to, you can even organize your feeds using folders!
  7. Top Recommendations. G-Reader will take the sites/blogs you already subscribe to and suggest others that may be of interest to you. Another great way to find new sources of information and inspiration. (You can also access this page by clicking the “Discover” link next to the “Add subscription” option in the left side.)
  8. Recently starred. Lists your three most recently starred items.
  9. Recently shared. Lists your three most recently shared items.

When you click on one of the items in your subscriptions list, the feed will show itself on the right side:

Right now I have G-Reader set to “Expanded View,” which shows the entire feed. You can also choose to have your feeds shown in “List View” by hitting the tab circled below in red:

This is useful for those who just want to skim over the headlines. If you want to read more, you can click on the title and the full feed will expand right below it.

Let’s go back to the Expanded View. You’ll notice that under each item, you have some options:

  • Add star
  • Share
  • Email
  • Mark as read
  • Add tags

These are all pretty self-explanatory, but Email is a favorite of mine because you G-Reader links to your Gmail account and embeds an email box right into the window:

I love using this function whenever I see a particular item that may be of special interest to a friend…I can email it right over to him/her!

Another useful feature is the “Trends” page:

If you are into data and statistics like me, this page can be fascinating. One particularly useful portion of the Trends page is the “Subscription Trends” section, where you can see a ranking of the most frequently updated subscriptions, inactive feeds (which shows the last time the site was updated), and most obscure (meaning the least amount of subscribers). I used to subscribe to perhaps three times as many blogs and websites, but this “Subscription Trends” section has helped me weed out the outdated subscriptions.

There are two more features I want to discuss: search and offline mode.

The search function, circled on the left, was surprisingly only added a couple of months ago. Before this, whenever I wanted to look for a certain item I remembered reading, I would have to go through my subscriptions one by one. The search function has become a lifesaver for me, especially since you have the option of where you want to search: all, starred, shared, friends’ shared, or a specific subscription.

The offline mode (circled on right) works with Google Gears to let you read your subscriptions while offline. When you select the offline mode, G-Reader starts downloading your feeds to your local drive so that they are accessible whether you have an internet connection or not. This is especially useful if you have a long commute, or about to go somewhere with no reliable internet connection.

The best part? Once you are connected to the web again, you can switch back to the online default mode and your “read” and “unread” items will automatically sync. 🙂

Have I convinced you yet? Even if I haven’t, I hope you at least found it interesting. If you have any questions at all, please feel free to ask!

You may also like:

Apr 3, 2008  •  In Thursday Geek-isms

Hump Day Hook-Ups

(I’m always reading and learning the most interesting things on the web but I can never keep track of them all! So I’ve decided to add this new feature to my blog: every Wednesday, I will highlight the top 10 interesting things I’ve read in the past week. Let me know how you like it.)

Welcome to the first installment of Hump Day Hook-Ups! Here’s what’s been keeping the geek laughing, rolling her eyes, or très excitée this week:

  1. Knicks assent to several demands to get Walsh, ESPN. I’ve had a renewed hope for my boys ever since the rumors about Walsh surfaced…and today, they finally made it official! 😀
  2. April Fools’ Alert #3: Legend of Zelda movie by IGN, Joystiq. There were some very good April Fools’ Day pranks/jokes this year (including one pulled on a certain someone by many of his friends on Facebook…hehe, ask me about it!) but this has to be my favorite. I really wish they were coming out with this movie!
  3. Friday Fun: Watch Star Wars in Text via Telnet, Lifehacker. Don’t you love it when some other obsessed geek takes the time and dedication to create something so creative yet obvious, à la “D’oh! Why didn’t I think of that?”
  4. Metareview — Ninja Gaidan: Dragon Sword, Joystiq. The new Ninja Gaidan’s been getting some sweet reviews. Me must purchase! (As soon as I get some time to start gaming seriously again, that is.)
  5. Life-Size Star Wars Droids Can Speak, Drain Wallets, Gizmodo. R2-D2’s my favorite Star Wars character…need I say more?
  6. Your First Taste of Bruno, Perez Hilton. Are you a Borat fan? Sasha Baron Cohen is at it again, but this time as Bruno, a gay Austrian. Perez brings you some hilarious footage that was taken by a passerby.
  7. Brilliant 404 Pages, Neatorama. There’s good web design, then there’s good AND clever web design. I love how these websites have taken something seemingly as trivial as a 404 page and turned them into pure brilliance.
  8. BlackBerry 9000 First Impressions, Boy Genius Report. BGR gives a short but precise report on the new, highly anticipated Crackberry model.
  9. Adobe launches Photoshop for the web, LifeClever. This has to be the biggest design-related news of the past week. While the online version isn’t as comprehensive as the original (no layers!), the flash-based version of the app is FREE, and from reviews, not too shabby.
  10. Mario Kart launch trailers are comprehensive, Nintendo Wii Fanboy. Can’t wait till it comes out!
Apr 2, 2008  •  In Geek, Tutorials

Google Reader, Part 1

(I felt compelled to write this two-part series because I still have daily run-ins with people who have never heard of Google Reader. How? Why? The concept boggles my mind, because G-Reader is my favorite Google App and I can’t imagine why any regular web user would NOT use it…)

Do you have a lot of websites/blogs you visit daily? Do you bookmark each site and diligently click over to check for updates?

Well, that’s all fine and dandy, but if you have a lot of sites on your bookmark list, visiting each individual site could take hours. There is an easier way to do this, and it’s called RSS (Really Simple Syndication).

If you are familiar with RSS, feel free to skip this portion. If you’re not, you’re a moron. Just kidding. 😉

Here’s a really simple way of looking at RSS (thanks, J!):


(image from http://cravingideas.blogs.com/backinskinnyjeans/2006/09/how_to_explain_.html)

Take a look at the website above. They do a great job of explaining RSS in a clear and simple manner.

Still stumped? Watch RSS in Plain English:

(This video was created by Common Craft, a website dedicated to explaining complex ideas and concepts in simple and easy ways. Go check it out – they have so many great articles and videos!)

So what does RSS have to do with Google Reader?

Google Reader is a FREE application for reading RSS feeds. One of the most important things that sets G-Reader apart from other RSS readers is that it is web-based, meaning that I can check my feeds from any computer (or my mobile phone) and G-Reader will update itself accordingly. This is a big contrast and improvement from desktop RSS readers, which only update the feed based on what I checked from that particular computer.

Next up…the many useful features of Google Reader and how they can help you save time, share ideas, and learn more!


On a side note, my friend’s been writing an interesting series on his blog about the book The Tipping Point by Malcolm Gladwell and the three types of people who make it possible for a social epidemic to take place.

My friend is convinced that I’m a Maven, and used me as an example in today’s post.

What do you think? Am I a Maven? Do you think you are (or know of others) who are Connectors, Mavens, or Salesmen?

You may also like:

Apr 1, 2008  •  In Baby, Geek, Personal, Shopping

Baby Geek

I’m at that age where a lot of people in my social circle are getting knocked up or trying to get preggers. Naturally this freaks me out because I still consider myself a kid. I may have a job and a mortgage to pay but I still have the tendency to regress back to my five-year-old self much more than necessary. Although I hate to admit it, I’m secretly terrified that I would make a horrible mother. Many people have told me that I would be a great mother because of my innate desire to always be taking care of others. However, this is  human life we’re talking about here. A mother has the potential to seriously f*ck up a child’s well-being. While I may not turn out to be a great mother, there’s one thing I do know for sure: my babies will be geeks, just like their mommy. And I intend to start training them from the time they’re out of the womb. How, you ask? Well my friends, you’re in for a geeky ride…

 

1. Nintendo Baby Blanket In 2006, Rich and Ruth Ng (those lucky bastards!) received this handmade blanket from their friend Claire Pearson. You can see more pictures here. How sickeningly adorable is this?!? I plan on downloading the pattern and making this for my future spawn as soon as I find out I’m pregnant (years down the road, of course).

 

2. Star Wars AT-AT Stroller Last year, an über-cool dad modded his kid’s stroller to resemble an AT-AT (see more pictures and read the interview at the Star Wars Blog). Almost immediately I was filled with disdain for my parents for not being nearly as geeky as this dad.

 

3. Nerdy ABC Flash Cards A is for Atom. B is for Binary Code. C is for Cellular Membrane…’enuff said. If I had these when I was learning English, I would’ve caught on a lot faster. You can purchase these cards at Etsy.

 

4. C-Jump: The Computer Programming Board Game According to C-Jump’s website, this boardgame “helps children learn basics of programming languages, such as C, C++ and Java.” Screw Candyland! My kids are playing C-Jump instead!

 

5. Geeky Apparel Lola of North Beach is a great online store that sells great babygeekwear. The items they carry include:


Goo Goo Ga Ga onesie. Perfect for any future Googler.


iPood onesie. This one makes me giggle.  🙂


“My Dad’s a Geek” onesie. How come they don’t have a “My Mom’s a Geek” one? Hmmmph…

 

6. Knicks Apparel You don’t think I would let my kids grow up not loving the Knicks, do you?  😉  My Houston jersey has been worn and washed so many times that all the lettering is peeling and practically unrecognizable…but all the abuse has left it soft and super-comfy. I plan on swaddling my kids in this jersey. And I definitely want to purchase additional baby wear:


(I wouldn’t get the Marbury one, of course…but this was the only one they had at the NBA Online Store.)


Too. Cute. For. Words!!!

 

7. Hopkins Apparel Although I’m not THAT into lacrosse, I have to throw this one in. Go Blue Jays!

You may also like:

Mar 31, 2008  •  In Funny, Geek, Marketing/Advertising, Movies, Star Wars

Kudos to Spike TV

A few weeks ago, I walked out of my office building and nearly screamed in delight to see this:

(My camera phone took pretty lousy pictures that day so I was reluctant to post them. Fortunately, I was able to find these photos at TheForce.Net. Although these weren’t taken by me, this is the actual view when you walk out of my office building.)

“Gold bikinis never go out of style”…how effing brilliant!!!

A couple of days later, I found this just one block away:


(photo from Gothamist)

Yes, that tappity-tap-tap is the sound of the geek in heels, jumping up and down in excitement. I want to take a bus from this bus stop just so I can live out the experience in its full glory.

Wait, it gets better.

A few days later, I saw ANOTHER ad on the train. I burst out laughing, forcing quite a few morning commuters to look up in surprise.

I did a bit more searching and found two more ads in this series:


(all three images from SlashFilm)

I have always been a sucker for good advertising and this is no exception. So Spike TV is airing all six Star Wars episodes. Big deal, right?

However, you have to realize that the product they are trying to sell is one of the best-known film franchises in history.

How do you sell something when the majority of your target audience has already purchased the product (or in this case, seen the movies)?

How do you kill that which has no life? (Sorry, stupid South Park analogy.)

It is precisely for this reason that I have to give Spike TV and its advertising group major props for this series of ads. They have taken a popular and revered product and re-packaged it with a fresh and comical twist. They have managed to target both Star Wars fanatics and potential new arrivals alike: the fanboys are reminded of the little things that made them fall in love with the franchise in the first place, while the newbies are drawn in with hints of sex, camaraderie, pride, and humor.

Bravo, Spike TV. Well done. 🙂

You can visit the Spike TV Star Wars homepage here.

You may also like:

Mar 29, 2008  •  In Art/Design, Career, Education, Personal

National Portfolio Day

A few days ago, LifeClever posted an articled called Portfolio Day might make you cry, but it’s worth it. I suddenly had a flashback…

As mentioned in my “About” page, I once was a very serious artist who was hell-bent on attending a good art program at one of the nation’s top art schools (RISD, Cooper Union, UCLA, Art Institute of Chicago, and MICA were my top choices). During the summer between my junior and senior years in high school, I was a regular fixture at my art studio, attending portfolio class every weekday from 12pm-3pm. I would often stay overtime to finish up and discuss my work and options with my beloved instructor.

Most art programs require 10-20 pieces demonstrating a student’s technical and creative abilities. I’m not sure about others, but my pieces often took 20+ hours from inception to completion, and I had 17 pieces in my portfolio…you do the math. I still remember the moment when my art teacher handed me the slides of my completed work and I nearly cried from joy.

I was ready to start applying to the said schools. But first, I had to go woo the top dogs at a National Portfolio Day:

National Portfolio Day is an event specifically for visual artists and designers. It is an opportunity for those who wish to pursue an education in the visual and related arts to meet with representatives from colleges accredited by the National Association of Schools of Art and Design. Representatives will be available to review your artwork, discuss their programs and answer questions about professional careers in art. High school students, parents, teachers, guidance counselors and college transfer students are encouraged to attend.

Unlike the AIGA Portfolio Day mentioned by LifeClever, National Portfolio Day is sponsored by the NPDA and is targeted for high school students and college transfer students.


National portfolio day @CCA by kenichi.tanaka at Flickr

All high school students interested in attending an art school are HIGHLY encouraged to attend a National Portfolio Day.

I talked to some older friends who gave me tips:

  1. Get there early!
  2. Scope out the list of schools attending beforehand and choose 3-5. You will most likely only have time to attend 3, since the lines for the more popular schools can get VERY long.
  3. Bring food, drinks, and a friend or two who can keep you entertained and hold your place in line when you have to pee.
  4. Never, EVER leave your portfolio unattended.

I was not able to attend the portfolio day held in NY due to scheduling reasons, so my parents and I woke up at 5am one Sunday morning to drive down to Philadelphia.

Unfortunately, Cooper Union and UCLA were not attending this particular portfolio day. So I narrowed my list down to RISD, Art Institute of Chicago, MICA, and Carnegie Mellon. My friends were correct – the lines were ridiculous! I think my parents and I waited 2-3 hours for each school.

I remember being a big miffed that RISD had only sent one associate professor and some students. Being the top art school in the nation, they were a bit snobby and frankly, treated me as if I were just a number.

I also remember how the rep for Carnegie Mellon was very patient and extremely nice…and even made me blush a few times by the comments he made on some of my pieces.

My overall impression of National Portfolio Day was a bit overwhelming. I had never quite realized how popular and competitive the art world is…and I was discouraged by the blasé response I’d gotten from some of my top choice schools.

However, the experience was not without benefits because few weeks later, I received a letter from Carnegie Mellon. I had made such a great impression on Portfolio Day that if I could provide an official transcript confirming a GPA of 3.0 or higher, I would be admitted with no questions. No essay on my application or anything like that! They even offered a very handsome scholarship. 🙂

In the end, I was accepted to some of the top art programs in the country…but I decided to go another direction. This decision will be the topic of a future post.

You may also like: