Tweet This Post Digg This Post Reddit Stumble This Post

Tweet This Post Digg This Post Reddit Stumble This Post

New UI Button – don’t forget to click!

Which is just a link and a span, code-wise:

<a class="uiButton" href="#"><span class="uibb">New UI Button</span></a>

Internet Explorer kind of hates it, with no rounded corners and some questionable hover behavior, but overall I’d say it’s a win.

Browser testing:

CSS3 Button Browser Test

Here’s the CSS:

a.uiButton {
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    border-radius:4px;
    margin:15px 5px 15px 0;
    border:1px solid #ccc;
    color:#45a;
    display:inline-block;
    zoom:1;
    font:12px/18px 'Lucida Sans Unicode','Lucida Grande',Helvetica,Arial,sans-serif;
    text-decoration: none;
    background-image: -moz-linear-gradient(top, #ffffff, #cccccc);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff,endColorstr=#cccccc);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff,endColorstr=#cccccc)";
    *display:block;
}
a.uiButton .uibb {
    display:block;
    border:0px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    padding:2px 5px;
    background:transparent;
    margin:1px;
    background-image: -moz-linear-gradient(top, #ffffff, #cccccc);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff,endColorstr=#cccccc);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff,endColorstr=#cccccc)";
}
a.uiButton:hover {
    color:#35c;
    border-color:#aaa;
}
a.uiButton:hover .uibb {
    background:transparent;
    background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#ccc));
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#eeeeee,endColorstr=#cccccc);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#eeeeee,endColorstr=#cccccc)";
}
a.uiButton:active .uibb {
    padding:3px 5px 1px 5px;
    background:transparent;
    background-image: -moz-linear-gradient(top, #bbbbbb, #eeeeee);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#bbb), to(#eee));
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#dddddd,endColorstr=#cccccc);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#dddddd,endColorstr=#cccccc)";
}

The gradients should even work in IE… just not the rounded corners. Haven’t had a chance to test every browser yet.

Tweet This Post Digg This Post Reddit Stumble This Post

Tweet This Post Digg This Post Reddit Stumble This Post

During that chat, a lot of ideas were covered, and Raph briefly touched on how he thought offer-based marketing was a big new trend at GDC. Here’s the chat log, edited for relevance:

SL: Kim Chihuly: so fremium and microtransactions – any other new busines model stuff from GDC?
Raph: Yes! offer-based marketing
Raph: Huge new trend
gracemcdunnough: Raph, explain?
Raph: Offer-based marketing: where users are offered discounts/coupons/special access to partner programs, and referral revenue is paid to the oeprator
Raph: Reports from companies exploring this is that it has resulted in a 30% or so increase in their revenues
WorldMaker: Isn’t offer-based marketing entirely too 1990s Web 1.0?
SL: Dave Zeeman: Sounds like those “Get a free XBox 360!” ads.
SL: Adri Saarinen: Oh man, Offerpal was all over GDC
SL: Dave Zeeman: only in reverse
gracemcdunnough: Bounties, those were popular in the early web days

Full log here (Requires Metaplace beta account)

So I tossed “Research Offer-based Marketing” into my notebook, and forgot about it for a few days. Upon reading it again, I hit up good ol’ Google for some info. Probably the best article I came across was this one at VentureBeat. Good stuff.

How does this apply to my own interests, Listy in particular? Well, I’m always interested in marketing ideas – that’s just how I am. I’m particularly interested in marketing that doesn’t inconvenience the audience. No annoyance, etc. Given that, this seemed like a pretty good idea – I get revenue, user gets two somethings instead of one.

Now throw in virtual currency. What if the premium services on your web app cost a specific amount per month in virtual cash, and you can pick and choose the services you want (rather than free/premium boolean style)? Each service costs a little bit, user’s pages can have tip jars (tie it into twitter, even: @listybot: tip @tkstudios 100), users can buy points, or get ‘em via free offers.

It’s a pretty fun concept. A bit more complex than just having paid accounts, but definitely much cooler, and more importantly, much more fun. And fun’s what it’s all about, isn’t it? I mean, besides functionality and usefulness and a hundred other factors…

Tweet This Post Digg This Post Reddit Stumble This Post

I am resigning my position as co-owner, effectively making CEO 100% owner. I might come back as a coder in, say, a year or so, but it’s not likely. It’s part of my fat-trimming that I’m doing in order to be sure that the business ventures I’m about to launch are successful — less distractions, less worrying, etc. So, I’m freeing myself of gray shard development.

This is not to say I won’t take part in any game development in the future: Game design and development remains something I am greatly interested in and enthusiastic about, but I simply don’t have the time for it right now unless I’m going to be paid for it. Believe me, I have plenty of ideas, I’m an ocean of ideas, but it’s making everything work at once that I can’t do.

Who knows, maybe in half a year I’ll turn around and hire the Alexandria development team to work on games for profit. You never know.

Tweet This Post Digg This Post Reddit Stumble This Post