I Give You My CSS3 Heart

I made this little heart shape with CSS3, which I’ve been playing around with lately as a way of rendering rounded corners in the latest version of Subscription Options. Turns out there’s loads you can do with CSS3!

Here’s the (admittedly complex) code that’s used to render the above:

#heart {
    position: relative;
    width: 100px;
    height: 90px;
}
#heart:before,
#heart:after {
    position: absolute;
    content: "";
    left: 50px;
    top: 0;
    width: 50px;
    height: 80px;
    background: url("http://files.digitalcortex.net/images/header/rotate.php"); // this makes the colour the same as my header image - but could be any HTML colour instead
    -moz-border-radius: 50px 50px 0 0;
    border-radius: 50px 50px 0 0;
    -webkit-transform: rotate(-45deg);
       -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
         -o-transform: rotate(-45deg);
            transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
       -moz-transform-origin: 0 100%;
        -ms-transform-origin: 0 100%;
         -o-transform-origin: 0 100%;
            transform-origin: 0 100%;
}
#heart:after {
    left: 0;
    -webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
         -o-transform: rotate(45deg);
            transform: rotate(45deg);
    -webkit-transform-origin: 100% 100%;
       -moz-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
         -o-transform-origin: 100% 100%;
            transform-origin :100% 100%;
}

If you’re interested in playing around with CSS3 shapes like the above, loads of them are are available at CSS Tricks.

Web Discoveries for September 22nd

These are my del.icio.us links for September 22nd

Crowdsourced Protein Shakes

I read about Foldit in Wired US yesterday, a game that takes the foundations laid by SETI@home, which uses thousands of computers’ idle time to decode frequencies from Space, and crowdsources solutions to the protein folding problems that are currently baffling the smartest machines in the world.

The difference with Foldit is that it’s not PC idle time that is tapped into here, but players’ idle time. There is no algorithm that can yet match humans’ depth perception; natural ability to recognise patterns; and see causal links in their actions. These traits make us humans the ideal CPU to solve these ‘protein-puzzles’:

Foldit provides a series of tutorials in which the player manipulates simple protein-like structures, and a periodically updated set of puzzles based on real proteins. The application displays a graphical representation of the protein’s structure which the user is able to manipulate with the aid of a set of tools.

As the structure is modified, a “score” is calculated based on how well-folded the protein is, based on a set of rules. A list of high scores for each puzzle is maintained. Foldit users may create and join groups, and share puzzle solutions with each other; a separate list of group high scores is maintained.

Indeed, the creators report that groups working together have led to breakthroughs not matched by either individuals or heavy-duty computing power. It is the power of the engaged-masses that the Baker Lab, research team behind the game are hoping will bring forth potential cures for HIV/AIDS, Cancer and Alzheimer’s.

More info on the game and it’s background on their Science Portal.

Does this remind anyone of War Games?

Where is freedimensional?

You’ve probably read about Google Latitude, and maybe even used it yourself. I’ve been using it mostly without meaning to, because I activated the service on my N95’s Google Maps and the bloody thing never turns off. Here’s where I am right now:



Locative technologies are a growing area of interest for me. I believe that GPS, cell-tower triangulation and even good old Bluetooth will play a large part in making cloud-computing extra-relevant to consumers.

I know that people get a bit funny with the blend of real locations and virtual space (see Google Street View debacle) but once we’re all using our next-gen pieces of UI, your networked device could begin to act as a portal to new layers of information useful to you about the city, street, or shop you are in.

I am talking about location-based advertising. An implementational nightmare, but it is foreseeable that Semantic technologies could serve geographically relevant messages, charging advertisers on a cost per impact basis. Google kind of do this with their local search results. It’s a bit shit at the moment though.

The nearest we have to the kind of next-gen solution I’m thinking of is lastminute.com’s free service NRU, available on the Android OS. It lets you scan around your environment with your phone acting as a viewfinder, where cinemas, restaurants and theatres are overlaid in a sonar-like interface. These services pay a small amount to lastminute.com on an affiliate basis, or are paid inclusions:

NRU for Android, from lastminute on the G1

There’s one locative service I’m disappointed never took off in the UK, despite being around for a while. BrightKite is a kind of location-based Twitter, and it had real promise until Google came stomping all over them with the release of Latitude.

If I were to ‘check in’ at The Queens Larder on Russell Square, BrightKite users would see my marker and message on a map of the area, as well as other people checked in nearby. The potential for social interaction is high, because through using the service one feels proximity with other users.

With all this in mind, I’d like my readers to ‘feel closer’ to me, so as well as in this post I’ll be placing my Latitude Location Badge on my Contact Page. If you’re in the vicinity, go ahead and either serve me an advert or say hello. I won’t mind which.

The Subscription Options Plugin

My aim is to make my views on Digital Media, Branding and Emergent Technologies as accessible as possible not only to industry types, but to the blog-scouring early-adopting masses. My ongoing series on Augmented Reality has been relatively successful in boosting both the visitation and the subscribership of this blog.

Aside from the content I’ve written this month (May 2009 has been my most prolific since this blog’s inception) I have also started an SEO and social media strategy to extend the reach of the content I write here. I’ll share details later…

Anyway, the key element I want to tell you about in this post is my third strategy to make Digital Cortex portable to readers. I’ve started to provide readers with a range of subscription options, since the most common way for readers to subscribe to any blog and its content are through RSS, Email or Twitter. That’s when I came up with my brand new WordPress plugin.

I realised that my subscription solution might be useful to others also looking to grow their subscribership, so I created this:

The Subscription Options Plugin

This is how your subscriptions could look if you use my plugin.

I’ve turned my HTML code into a PHP-based plugin for all WordPress users that has the exact effect I aimed to achieve – to look good on a page, and for blog readers to easily grasp what each icon stood for.

Once installed it can be placed in any widget-ready area, allowing users to link to their various subscription options with ease.

PLEASE CLICK HERE FOR FULL PLUGIN DETAILS

Web Discoveries for May 27th

These are my del.icio.us links for May 27th

Wrigley to Launch New 5 Gum in UK

A new gum brand is about to hit the shelves. 5 Gum is designed to ‘stimulate the senses’ and it’s one of the most exciting new brands of the year.
I was lucky enough to get hold of a sample set:

IMG_0558The marketing lifecycle is about to kick off here in the UK with a heavyweight branding campaign designed to encourage product sampling. Let’s look at how the product was launched in the US, taken from the Wrigley corporate site:

  • 2007 In March 2007, Wrigley introduced U.S. consumers to 5, the most exciting development in sugar-free stick gum since the launch of Extra® more than 20 years earlier.
  • 2007 In August 2007, 5 gum unveiled its marketing campaign titled ‘Stimulate Your Senses.’ The advertising spots described “what it feels like to chew 5 gum.” Set against an industrial, futuristic backdrop, the cooling, warming and tingling sensations created by 5 gum flavors Cobalt,
  • Flare and Rain are expressed through dramatically stimulating visuals and sounds. The campaign also strongly leveraged magazine, cinema and online media advertising to showcase our new brand.
  • 2008 In 2008, 5 brand launched two new fruit gum experiences. Lush gum provides a crisp tropical sensation and Elixir gum is a mouthwatering berry sensation.
  • 2009 5 gum takes it to the next level with unique, game-changing flavor experiences. Solstice, a warm and cool winter, and Zing, a sour to sweet bubble, are new-to-world flavor transitioning experiences.

Do check out the 5 Gum YouTube channel for examples of the TV/Cinema creative, but in this post I’d like to review the packaging, which I believe is a point of difference that will give the product luxury status.

So to begin with, we’re starting with an initial three flavours: Cobalt – a cooling peppermint; Electro – a tingling spearmint and Pulse – a crisp tropical. Packs will reportedly go on sale at £1.50 RRP, to reflect that they are a considered rather than impulse purchase.

I’ll be looking at Pulse – the tropical flavour, which comes with little speckles of sharp citric stuff that actually gets your mouth watering when you first start chewing:

IMG_0560Notice how slick the box looks. Think about the colour of the last pack of gum you bought, and now say that 5 doesn’t look cool on this front alone. It does not look clinical like most gums do with their greens, whites and light blues. They look more like smart trading cards or a packet of condoms for that matter – gum for grownups.

IMG_0567It might be hard to tell from the above but the packs are slightly textured, with a heavy feel in the hand like holding a deck of cards. They slide into a back pocket pretty well. Build quality is excellent, made from a thick card and high gloss colour.

IMG_0569OK I admit the above is a shit picture, but it’s just to give you an idea of how you open and close the box. That flap of paper is embossed with glossy material so you can easily slide the box open with your thumb. Very James Bond. A bit like a book of matches, it’s an old school but perma-cool ‘paper technology’.

IMG_0570And there’s the money shot. You would not be ashamed offering someone a piece of this stuff, rather than one of those pocket-lint covered chiclets you have to fight the foil to thumb out. The designs on the inside are different for each flavour. This would be a great place to feature a QR code or even exhibit work from young artists.

And that concludes my short assessment of 5 Gum’s packaging. Look out for the TV, Online and Print creative coming soon. If you can’t wait, 5 have teamed up with Vice Magazine to generate early interest and reach into the difficult to please Hoxtonite crew – more info at Viceland whose readers have been asked to work with band Hot Chip to create a Launch Event in London that will stimulate the senses.

If you would like more of these sorts of reviews from me, please leave a comment. I look forward to hearing your feedback. Happy chewing.