Archive for the ‘Technical’ Category

Security, turning your passwords into sausage mash!

Monday, May 16th, 2011

Some people may be aware of the ongoing struggle Sony have have recently with the hacking of their Gamer Network and millions of their user details being stolen. To be honest, security is always a matter of time and money. So breaking into their network was clearly worth the money and I assume it wasn’t quick or simple to do!

However, what’s interesting about this story is how the company were thought to be storing their detail in clear text like below.

Passwords in plain text

Passwords in plain text

Storing details in plain text means that anyone who’s able to view the database has easy and plain access to the password. People like the staff, developers, marketing managers, database administrators and even hackers. Imagine how many times you use the same password for lots of different online accounts. That’s a pretty important piece of data for a company to not cover up.

So I felt compelled to write about the Thought Den method we use to store our users’ passwords in any bespoke modules of our online software.

Hashing of passwords
None of your passwords are ever kept in plain text. We immediately use a “one-way hashing algorithm” and a hidden keyword to hide your passwords when they’re saved. Or in English, we put it through a sausage masher and then save the result. Then anyone who views the data will never see your passwords in plain simple text, just a mashed view.

Passwords that are hashed

Passwords hashed

Nice right! And the beauty is, it can only go one way, so there’s no de-cyphering it backwards.

Next post. SQL injection attack… or in plain English, keeping your borders well checked against trojan horses.

New Geek Club! Pushing online 3D with Flash and Molehill

Friday, May 6th, 2011

A new Geek Club video for you all to enjoy this Friday…

This is a demo of some of the capabilities of the upcoming Flash Player 11, using the alpha Molehill APIs, and a pre-release version of Flare3D. It uses the Spinosaurus model from the AR project we did for the BBC (SpinARsaurus Challenge), and highlights the vast difference in graphical capabilities between previous versions of Flash (up to version 10) and the next release.

The model itself contains 10,000 polygons, which left the CPU working very hard even at 25 FPS, using Papervision3D and software rendering. Now with 60 instances of the same model, it renders extremely smoothly even at 120 FPS. Molehill and Flare3D – along with a number of other up and coming FP11 3D engines (Away3D, Alternativa3D, Unity3D) – also open up further possibilities with full support for complex shaders. In the demo, we went for a shiny, cel-shaded appearance. All the danger of a raptor, plus a backful of spines and twice as slippery. (This is also why they don’t need to move their legs to get around. No friction.)

Spinosaur Shenanigans

The animation comprises a red vs. green game, starting with one red (zombie) dino, and 59 green (uninfected) victims. When a red catches a green, they join the bad side. And if they hit the edge of the square, or each other, they bounce off, dazed, before resuming the chase/escape. Just like how scientists predicted spinosaurs behaved in the wild, centuries ago.

The SpinARsaurus Challenge – AR tech wizardry for the BBC

Friday, March 25th, 2011

It’s been a challenge alright! With only a 4 week build to develop an identity, tackle 3D, print and online design, overcome technical challenges and add our usual high production standards, it was never going to be easy. The fruits of our labour can be seen on the spinARsaurus page at BBC learning development.

Identity design

logo-spino-on-black

Motion graphics

grab-2grab-1-1

AR marker controlled puzzle

grab-1

The output!

Spinosaur4

A little technical rundown

Good performance was at the fore of all minds on the project. How many polygons were too many? Which 3D engine would be quickest? What minimum specs were (un)reasonable? And at what point does tomorrow’s noon deadline become more attainable by going home and sleeping? By hook and crook, we struck the right balance, but not before a few bouts of panic.

swcIn the pursuit of faster marker detection, we started with an Alchemy-compiled version of the FLARToolKit. Alchemy is an Adobe Labs technology that allows C and C++ source code to compile to ActionScript bytecode and be executed in the Flash Player. The advantage that those lower-level languages have over high-level AS3 is great scope for optimised CPU instructions and memory management. But! -using SWCs that other developers have created is akin to buying a car on eBay without seeing any pictures. This particular vehicle was as fast as promised, but leaked oil [memory] at an alarming rate, and would insta-crash on wet tarmac [Google Chrome]. memory consumption We tried what we could from outside the black box of that precompiled code to resolve the problems, but it became apparent that we’d need to switch over to the more dependable, slower AS3 version, and seek our performance gains elsewhere.

Beyond the FLAR  difficulties were the need to manage dinosaur textures with some sophistication. Trying out the construction game, you’ll see that individual bone segments are alpha-ed down and up independently of the rest of the model. Papervision3D supports this sort of control while the Collada model is rendered with vector fills for textures, but setting a DisplayObject3D’s alpha property with bitmap textures present will quietly do nothing.

texturesOur workaround involved the exposed BitmapData of each texture, and the application of ColorTransforms on a per frame basis. And since such transformations are lossy and non-reversible, a custom tweening function was needed to clone the original pixels at each time step, before reapplying the ColorTransform with an incremented alpha offset. (Intel Celerons, go home.) Where this approach made acute pain for Justin, our 3D modeller, was in the need to break apart the model’s textures into individual materials, for every segment that we wanted to fade in and out. Not knowing the final set of editable bones, we were left with over a hundred separate texture files to manage. And that’s why we’re all sleeping so well these days.

The people that made it possible

A big thanks to the team that worked so hard on this. We have:

Adam Vernon – Lead Flash Development

George Crabtree – Flash Development

Ben Webb – Lead Designer

Justin Dowling – 3D awesomeness

Antoine Kougblenou – Testing / javascripting

Dan Course – Calming words in the eye of the storm

Ben Templeton – Project lead and Creative Direction

Our client contact at the BBC, who has been fantastic, showing incredible support, patience and ambition.

Dinosaurs take over Thought Den office…

Wednesday, February 9th, 2011

We’ve landed a neat little R&D project with BBC Learning Development that aims to explore how Augmented Reality can be used in education for children. Great news for our expanding educational output, that includes live events, games, animations and bespoke online applications.

The project will launch at the Big Bang Science Fair in early March and presents users with a familiar problem – re-assemble the mixed up parts to form the whole. This time the twist is that the puzzle takes a 3D dimensional form and interaction occurs with an AR marker via the webcam. The best bit? Dinosaurs are involved. Dan is very excited.

dino-3dino-4

What better way to start a research project than with a real-life puzzle and a cup of coffee. Play Nicely laid down the gauntlet by assembling their dino-kit first, though we’re not entirely sure how anatomically correct their version is. Justin, in full 3D himself, will mastermind the modeling and Mr Adam Vernon will be developing the Flash interface.

dino-1dino-2

We’ll be using a mixture of the FLARToolkit and papervision, though the current debate is how to get the smoothest effect for live 3D and a model that has over 3,000 polygons. We’ve even discussed creating a series of PNGs for increased verisimilitude at the expense of full 360 interactivity. Tests will be posted for comment if anyone out there is interested in our progress.

Over at Play Nicely, the boys are making leaps and bounds with their Total Immersion AR projects, but for this brief it was essential no 3rd party software was required beyond the usual Flash Player, which currently stands at 94% penetration throughout Europe…

Coca COOLa – Real world Facebook integrated marketing.

Friday, September 24th, 2010

Every summer for the past 3 years, Coca-Cola Israel has created an experimental summer camp/holiday resort called the Coca-Cola village. The event is designed for teenagers finishing their school years.
This year 10 villages were held across Israel each consisting of 3 days of swimming, music, stand-up comedy and sports which attracted a total of 6,500 teenagers (though the supporting Facebook page has around 55,000 signed up.)

Coca Cola Village

Coca Cola Village


In order to gain exclusive entry, teenagers needed to collect 10 Coca Cola caps each, gather eight friends who did the same and then register online through Facebook.

Experimental live marketing agency Promarket teamed up with Coca-Cola Israel to provide the visitors with special RFID (Radio Frequency Identification) bracelets that would securely hold their Facebook login & password and allow them to share their experiences via Facebook.
When the bracelet was swiped it instantly updated the user’s status with what they were doing at the event. The bracelet also allowed for automatic tagging of all the photos taken at the village. The event held 650 teenagers a day and with the seamless Facebook integration, 35,000+ posts were generated every day, totalling over 100,000 posts for the event.

A person tagging their RFID bracelet against a Facebook 'Like' sensor

A person tagging their RFID bracelet against a Facebook 'Like' sensor


A real-world Facebook Like button

A real-world Facebook Like button


'Like' the food?

'Like' the food?



This is a great way of pairing physical, real-world interaction with Facebook and Coca-Cola definitely got plenty of social media advertising from the attendants.

To further explain the technology, radio frequency identification (RFID) uses a tag which can be applied to or incorporated into a product, animal, or person to identify and track using radio waves. Typical uses of RFID tags include mobile phone payment systems, transport payment (Oyster card), product tracking, animal identification, library book security, digital e-passports.
This is not the first time a company has largely adopted a new technology for marketing purposes. Some examples include Pepsi printing QR codes on the sides of their drinks bottles for scanning with a mobile phone to link to the Pepsi mobile website, BMW’s Z4 Augmented Reality car, Oasis Rubberduckzilla AR games, Arcade Fire’s world first HTML5 powered music video.

Thought den are frequently asked to use new technology and as a studio we have created several similar projects you may be interested in taking a look at:
BBC Milk
IG Fest
RNCM
Parashoot SMS


Thought Den is Digg proof thanks to caching by WP Super Cache