Which tutorial would you like me to do?

View Results

Loading ... Loading ...

Chinese language tips for web design

Recently I needed to work with some Chinese and we had tons of trouble trying to figure out which fonts to use and how to specify them in CSS. After a lot of detective work and comparing long font lists we found some basic font choices that should work on both PC and Macs that have Chinese language packs active. I want to archive them here just in case I need to reference this ever again since it was PAINFUL…
Some Chinese Website tips:

  1. Specify English fonts first and then the Chinese fonts in your font list. This makes it so English fonts render with your desired fonts then the Chinese fonts pick up the other characters. font-family: futura, arial, Hei, “Microsoft YaHei”, “MS Yahei”, “宋体”, sans-serif;
  2. Standard chinese sans-serifs are: Hei, HeiTi or “Microsoft YaHei”
  3. Standard chinese serifs are: “Fang Song”, or “宋体”
  4. Set a meta tag to display chinese charset: utf-8. <META HTTP-EQUIV=”content-type” CONTENT=”text/html; charset=”utf-8″>

References:

Augmented Reality – Test 1

Yukiko's test of Augmented reality

I just got my augmented reality demo to work! It was really easy – Just one afternoon of work. To try it out you need: A webcam, a printout of this page. Click on this link and hold up your printout to your webcam in order to play with the demo.

I pretty much followed this video tutorial by The Flash Blog. It describes how to use the FLAR and Papervision 3d toolkits with Flex to detect a symbol in a video feed and map a 3D model to its plane. I just adapted his tutorial to Flash. (I’ll post my .FLA shortly)

Here were my overall steps:

  1. Download FLARToolkit
  2. Download Marker Generation tool (Air app)
  3. Made marker in Photoshop and printed it out
  4. Ran the Marker Generation app and saved a .pat pattern file
  5. Created FLARdemo.as class file, Flardemo.fla
    • in the .fla, declare Flardemo object, add to display
    • setupFLAR() – import .pat file
    • setupCamera()
    • setupBitmap() – load video feed into flartools
    • setupPV3D()
      • Create scene, camera, container
      • create lights, materials, objects
      • Create render engine, FLAR trans matrix, viewport
      • Add to display list
    • Create onEnterFrame event handler
      • Feed video to FLAR
      • test for symbol detection, if yes then,
        • get and set transform matrix
        • render papervision!
Some overall troubles and solutions included:
  • Since in Flash, not flex, I needed to declare, create, and add to display list a FLARdemo object in my .fla file. This wansn’t described in the Flash blog tutorial.
  • Also since I was working in Flash, library imports were a bit more complicated. I eventually gave up and cut/pasted from another tutorial that he was following. A less documented, but code provided tutorial is located here by a guy named Mikkoh.

A dream web design class

I have a question to poll the audience: If you were to create a new Web design intro class, what would you teach? There were plenty of holes in my knowledge left to fill after my first class (still are plenty of them), but what would you propose adding? Here’s my take on an intro web design class. Do you have anything to add/remove? Let’s be brutal!

Continue reading »

Band Album Cover: Pogonomys Championi

albulmCover

I finally decided to try my hand at the music album cover design challenge. The rules make it so that you get a random picture, band name and song title and then design a cover for such a selection.  Ivan describes the exact rules in his post.

Here is my cover art  for Pogonomys Championi, playing their hit single, “homework formerly eaten by the dog”. I liked the idea of pairing the light quirky background with the dark silhouette of a laughing dog. I tried to convey indie rock band with mayan flavor. The band logo is of course their champion mouse.

References: Pogonomys Chamioni is a tree mouse. The song title is a quote from Doug Larson, “Home computers are being called upon to perform many new functions, including the consumption of homework formerly eaten by the dog”. Original Photograph by ATLITW.

Photoshop CS3+ Letterpress Tutorial

letterpress tutorial finished

Here is a simple way to get a letterpress effect in Photoshop CS3 and above.

To summarize, you apply a bevel and emboss layer style to the area around the ‘imprinted’ art. For this tutorial, I will show how to make the effect and then use smart objects to warp it non-destructively. Continue reading »

Put yourself in my shoes…

This is why I moved....

Tracy and I moved units after seeing this wonderful view. We wake up and come home to this. No drummers beneath us is also a plus.

Triptych x4


Here’s something I’m proud of: A card with 12 images on it. What does that make this? a dodecatic? whatever. Just a fun(?) exercise. I remember making things like this in school.

DVD drive not found – a solution!

My Toshiba has problems. That said, every now and then it can’t find it’s own DVD drive. No power no detection, nothing. I’m suspecting iTunes is the culprit but who knows. In any case I found out that there’s a simple solution posted around the web but I found it in a forum here.

Steps

1) Open regedit.exe (Start menu > run, type regedit, and the exe should be listed)

2) Locate the following reg file in the following path:

HKEY_LOCAL_MACHINE
SYSTEM
CurrentControlSet
Control
Class
{4D36E965-E325-11CE-BFC1-08002BE10318}

3) Delete the values for the Upper and Lower filters.

4) Restart

Real Estate Website Attempt #1

I’m building a realtor’s personal website. Since I have never worked with realty, I need to learn a few things about MLS searches. Here’s a quick summary of my learnings followed by some process.

1) There are many many MLS databases. Each area/firm/agent has their own. These databases are their secretly guarded stash of people’s homes and their connected agent. Agents have their own action list of homes. These can be managed by things like open realty, a myPhpAdmin but for homes…

2) Getting access to search MLS databases requires a realtor that is a member of the MLS owner group.

3) If permission is granted by the MLS Provider, one can create a query and ftp whichever listings you want to your own database. Permission may require $$.

4) Most often 3rd party companies just provide the code that figures out how to display the listing info. (A good webdev/designer should be able to do this decently)

5) Some companies offer to host the MLS info, but that just takes the place of the original MLS. Heavy lifting here depending on how many people input into the database. These services are really only useful for big agencies like Century 21 who supports hundreds of agents.

TRIED:

  • Installing Open Realty 2.5.5 into a test site -> success, easy
  • Installing WordPress into test site -> success, easy

LEARNED:

  • Open Realty 2.5.5 doesn’t actually querry an existing MLS but just allows realtors to input listings themselves. Not useful for me.

PLANNING TO:

  • Need to contact Century 21 and ask how to get MLS access. May need actual realtor to make call.

Tonight’s sketch

I should be asleep now but I was having too much fun sketching in photoshop… Just a reminder to everyone to have fun every now and then.