Zach Margolis

OOPS I LEFT MY CAPS LOCK ON.

Thu, 23 Oct 2008 20:31:23 MST

A recent trend in websites: HUGE ALL-CAPS TEXT ON A WHITE BACKGROUND, with Chuck Norris style humor. Here are the three I've come across, with some choice quotes. I'm sure there are plenty more.

WaltMossbergSays.com pokes fun at the influence of Wall Street Journal writer Walt Mossberg
BAAAAAAAAAAAH. ::CHEW:: ::CHEW:: ::GRAZE::
BarackObamaIsYourNewBicycle.com is a list of things Barack Obama would do just because he's your friend, if he were your friend (which he definitely is).
- BARACK OBAMA HELPED YOU MOVE A SOFA
- BARACK OBAMA THOUGHT YOU COULD USE SOME CHOCOLATE
chocklock.com has something to do with Craig Hockenberry (of the Iconfactory), and I can't quite tell what it is, but it appears to be some big in-joke. I have a feeling it's related to his c4[2] presentation entitled IPHONE ITS NOT A FRICKEN MINATURE LAPTOP OK. The best part about the site is that the style extends into the source code for the page.
JUST THINK HOW MANY MEGABYTES YOU WOULD HAVE IF YOU ONLY USED SIX BITS

I think it might be time for a redesign! Just kidding.

Tags: internet

Better Late Than Never

Sat, 25 Oct 2008 13:27:35 MST

I just updated my web design portfolio to include projects from this summer. I guess it's only a month late or so, no big deal.

Tags: portfolio,site update,

Hash Tags, and Catching the Back Button

Mon, 10 Nov 2008 11:07:18 MST

I recently found a new Javascript trick that I'd like to share with the world. So it all starts when I was looking at taptaptap.com, a company that sells iPhone apps. I noticed that I could click to the different sections of the page, and they would animate. Then, I could click my browser's back button, and they would also animate. Amazing! How could they do that? In Javascript there is no way to directly catch a back button press as an event, so there is a little script running on a loop to look for the signs.

Web pages can use hash tags, or #something to jump to an element on the page with the ID set to id="something" and moving does not require a reload. This is important because it saves time, and scripts that are running stay active. So, when a user clicks on a link that goes to <a href="#something">, the location in the URI up at top changes to reflect this new “hash tag.” This means we can use Javascript to catch that change.

So, here are some important Javascript values to know:

document.location will give you the full text of the URI
document.location.hash will give you everything including and after the # in the URI
setInterval(function, ms) will call function every ms milliseconds. It goes on forever, unless you use stopInterval(), which is not necessary for this exercise.

Alrighty, now we have the tools, but we are going to need to call some functions as soon as the page loads. My favorite way to do this is reference the source of the script in the <head> of the page, and then run the scripts at the end of the page.

So in the <head>, I include:


<script type="text/javascript" src="/js/functions.js"></script>

And just before the </body> tag:


<script type="text/javascript">

<!--

initialize();

//-->

</script>

Where intialize() is a method that will set up my page, and the funky comment lines are so that older browsers don't just print the text on the page.

So now, we dig a little deeper. The initialize function will look something like this.


var selectedHash = '';



function initialize() {

    var currentHash = document.location.hash;



    window.setInterval(function () {

        if(selectedHash != currentHash) {

            doSomethingWithHash(currentHash);

            selectedHash = currentHash;

            }, 500);

        }

    }

So a few important things. There is a global variable selectedHash that does not go away, and is used as a reference to what is actually goin on in the page. Also, there is an inline function in setInterval(). You can call a function reference instead, but for a simple function like this, it is much easier to read the source. Then, you might notice I picked an interval of 500 milliseconds. This is twice a second, very often for a script to run. Normally, this could be very bad, but the choice we make is to run often, to catch user actions (specifically the back button, which changes the hash), and users don't like waiting very long at all. The effect is harly noticeable.

So, what does it look like in action? Well I updated my portfolios to reflect this. Check out going to /web/ and even /web/#colours to see how this Javascript can also allow for the right section of a page to be presented immediately through Javascript. If you look at the source, you may notice that I use slightly different functions in my scripts at the bottom of the page, but the result is almost exactly the same as these sample scripts.

Tags: internet,ramblings,site update,

Link Styles

Thu, 20 Nov 2008 12:23:04 MST

I happened to come across a blog today, iliveonyourvisits.com, and I really dig the style. The links are highlighted, not underlined, and have a really obvious “hover” state, so you know when you've moused over them. This is slightly unconventional, but makes a lot of sense. I think underlinining links is nice, but it might be too subtle. In print, people use underlining for emphasis, but on the web we‘re not really allowed to, because that would be confusing.

The coolness of highlighted links is compounded by the fact that highlighting links doesn't clash with anything else. Sure, you might think, “Well what if I want to print out and highlight an article that has links in it? Will that overlap?” Well it could be confusing, but if your print stylesheet hides the highlighting, when a page is printed, there won't be any links. It's not like hyperlinks are useful on the printed page, so that would actually be an amazing degradation.

What's more is that you could turn links into footnotes, since links and footnotes are essentially analogous. I'm not saying they're the same, but they're closely related. With a little bit of thinking ahead, you could add a superscript number using CSS after every link, and then put the link's address at the bottom of a page with that same number, just like a real footnote. This would be very functional. The one snag is that currently, print styles are not supported very well across browsers, but of course, in the future that will not be a problem. The future fixes everything, duh.

But basically, highlighted links are really cool. Using media-specific stylesheets, we can make them fit in their most natural way, like as big flashy link on an interactive web page, or simple footnotes used for reference in print. For the next revision of my site, I think I'll try to implement those kinds of links.

Tags: internet,ramblings,

Making Toast

Thu, 04 Dec 2008 00:04:57 MST

So I got a new toaster this year. It's great. I love it...when I'm paying close attention.

Burniness of Toast VS Time

So, as you can see, there's an ideal level of burniness. However, it's somewhere between “completely toasted” and “not toasted at all.” Basically, I have to watch this toaster vigilantly and wait for the precise moment when the toast is golden and crunchy. Also, I'm proud of my new word, burniness.

Tags: life,

Upcoming Changes

Fri, 26 Dec 2008 21:28:02 MST

So I'm working on an update to my website. For those counting at home, yes, this is the fourth redesign in a little over a year. The last major rehaul was in February or so, and I think the design has held up fairly well. I'm ready for something really fresh and exciting, and this new design takes a completely new direction.

There have been a few things on my mind during the design/prototyping phase of this new look. One is the theme—this next theme is column-based, and almost entirely composed of text. The only image is the background one, and I'm considering actually going for a background color instead. That cuts down on downloads, and on HTTP requests, which goes a long way in terms of just making the page feel faster to more people.

Another choice I'm making is to use slightly unconventional link styles. Just like I blogged about, I'm using highlighter-style background colors, and no underlining. I then used a CSS3 selector that allows me to separate external links (ones to other websites) from internal ones, and I specified a different cursor for those. Some people put little globes next to those links, or other little icons, but then they're just inserting images into their text. I think the advantage of this cursor-based system is that on a mouse-based system, visitors will be able to learn which links leave my site and which do not. On systems without mice, like phones, and even on older browsers, there is no significant loss, which makes this a progressive enhancement.

Also, I'm significantly trimming the navigation. I'm going to have one portfolio page for only my web work, and get rid of the About page. The About page is not exactly useful, and I've built a small footer that has all the important stuff to replace it. I don't need a separate page just for my two-line description of myself.

Some people might think that I redesign my web page more often that necessary. I would disagree because I am always finding out better ways to design the layout, better ways to write the code, and better ways to optimize download times. Besides, it's a lot of fun just to buckle down and work on my own site in between working for other people.

So keep your eyes/feed readers peeled for the next redesign, I hope that it turns out to be a good improvement.

Tags: ramblings,site update,

Crazy Apartment in Hong Kong

Fri, 16 Jan 2009 00:31:31 MST

The wall units, which are suspended from steel tracks bolted into the ceiling, seem to float an inch above the reflective black granite floor. As they are shifted around, the apartment becomes all manner of spaces â�� kitchen, library, laundry room, dressing room, a lounge with a hammock, an enclosed dining area and a wet bar.

I wish I had this guy's 24-in-1 apartment Hong Kong. I've always thought that super compact living situations were really cool.

That said, I might get tired of rearraning the entire space every time I want to eat or sleep. Still, it just looks awesome.

Tags: life,

I Can Use Photoshop

Sat, 17 Jan 2009 22:32:46 MST

As part of the Technocultural Studies program at UC Davis (my “major”), we are required to take weekend seminars in things like Photoshop. So I received the list of tasks to be completed for credit, and decided to just get them done.

The big, tie-it-all-together assignment was:

Create a mock magazine cover that is geared toward a demographic of Northern Californians in their early 20's. Your magazine cover should express a critical view of the role of technology in advertising

So I present my mock magazine, Blueprint. A Google search reveals that the name had at one point been used by an architecture magazine, but they shut down. Free for the taking! Maybe it's a little light on the criticism, but I had fun nonetheless.

Mock Magazine Cover

Tags: arts,projects,school,

The Third Dimension

Sun, 01 Feb 2009 14:58:59 MST

3D is a great buzzword. So you'd think 3D movies and TV would be a great thing, like holograms and transporters. However, I think that history has shown 3D won't ever become truly popular.

There's always some new 3D tech that claims to be super realistic, and this year's Superbowl has 3D Commercials. While the video doesn't seem ridiculous viewed without glasses, that fact that you still need to buy glasses is a problem.

At CES in Las Vegas this year, 3D was super trendy. Lots of TVs with built-in 3D, and games like Guitar Hero were modded to have 3D aspects to demonstrate the new 3D specs. I can't say that makes me excited. I remember a trendy 3D dinosaur game back on my grandpa's computer (roughly the early/mid 90')s, and it wasn't a very fun experience.

The glasses are the Achilles' heel of 3D. The glasses for TV shows and Superbowl ads are all disposable, so (go figure) people dispose of them when they're done. In an imaginary world where 3D really hits it big, would people really go out of their way to more permanent ones? I vote no. If you wear perscription glasses, then 3D glasses are still just a hassle.

One possible solution would be high adoption of 3D TVs, without glasses. These 3D TVs basically show viewers multiple separate images at the same time by basically vertically striping them. Depending on your angle from the TV, you see different vertical stripes, and then a 3D angle. Sure, in the case that every home in America gets one of these, 3D will have really caught on.

But not so fast—two other trends claimed to be able to revolutionize regular old American TV viewing: digital TV, and High Definition TV. They've both lagged a lot in adoption. The Digital TV switchover was mandated by the US Government, and has been hitting some snags as the blackout date approaches. Something on the order of 7% of people are completely unprepared (source: Engadget, and a number of small stations are not prepared either. As for HDTV, adoption is accelerating, but even the most generous numbers would put it at 25% of American households. This is a significant number, but still, that means at least three out of four households do not have an HDTV.

So if Digital and HDTV have had such lackluster attach rates, why on Earth would 3D be any better? Either route that 3D takes, glasses or no glasses, it will be met with too much resistance. I think that 3D is a nice gimmick, but I sincerely doubt that it will ever be a regular part household entertainment.

Tags: life,ramblings,

Working in Maya

Thu, 26 Feb 2009 12:07:40 MST

I'm taking a class in Maya this quarter, TCS 130 with Professor Neff. We've been working for something like six or seven weeks now, but I haven't made anything show-worthy yet. Now I have, so I'm going to present my scene: “Vegetables at Sunset.” Click on each image to view it in higher definition.

Long shadows at sunset.

I just really like this one, it really feels like a sunset.

Notice the subtle depth-of-field effect.

So, why vegetables? The professor kidded that everybody makes fruits for simple art projects (the classic “paint a bowl of fruit” assignment), so they must be too easy, and we should do vegetables. Technically, pumpkins and eggplant may be fruits, but we’ll let that slip.

Tags: arts,portfolio,school,

Facial Animation

Mon, 16 Mar 2009 18:07:50 MST

Here’s my latest project in Maya, a short animation that includes at least four different facial expressions, with transitions between them. I put some late hours into this one, and I think it was worth it.

Click to play. Compressed as h.264

Bonus points for naming all four facial expressions.

Tags: portfolio,school,

Nailed it.

Fri, 24 Apr 2009 19:25:45 MST

Jason Santa Maria nails the exact feel I had been going for with my website, but like, better. By a lot. This feeling that I have, it's like something was on the tip of my tongue, and he blurted it out before I could (and with more style).

So naturally, that means back to the drawing board for me.

Tags: internet,

Python

Mon, 25 May 2009 19:29:17 MST

After a few weeks in Professor Matloff’ ECS 145 class, “Scripting Languages” I need to declare to the world that the Python programming language is a pretty remarkable language.

I like the simple, approachable syntax: the lack of braces and semicolons makes the source easy on the eyes. I also like how Python has more of a direction than say, PHP. What I mean is that the functions are all named with the same conventions. I like that most of the built-in methods are easily recognizeable like __init()__, and __str()__. This way, I know what they are, and where they are used. PHP can’t even pretend that it has a consitent naming scheme for its functions. To me, PHP appears to lack this direction, and has evolved into a sloppy language.

Performance-wise, Python is supposed to be right up there with PHP, so in the next iteration of this website, I think I’d like to implement a Python back end.

Tags: life,school,

Summer Blog

Mon, 22 Jun 2009 11:41:45 MST

So, for the summer, I’m going to try out a Tumblr, so that I can more easily upload pictures and what-not to my blog while on the go in Japan. Check out summer09.zachmargolis.com/ to keep track of what shenanigans I post.

Tags: life,trip,

New URL

Fri, 18 Dec 2009 22:56:24 MST

Welcome to the new zachmargolis.com! Wait, huh? “The site is exactly the same as it has been for the past six months!” you may be thinking. Au contrare: I had a brief, fleeting moment of genius and realized that http://ΖΜ.com was available.

But so what? “http://ΖΜ.com is just another two-letter domain name!” you might say. Again, not quite. http://ΖΜ.com is actually Zeta-Mu, two Greek letters smashed together followed by a dot-com. Get it? In reality, the domain that I bought is http://xn--rxam.com, also known as http://ζμ.com. So now, I can be like some of the big names of bloggerdom and have my own personal short URLs.

This is only the beginning! More to follow!

Tags: internet,site update,