More to follow.

www.metrica.net

Front-end

The project was entirely created in Flash because of its interactive nature.

The interface was based on the timeline concept with parallax effect and huge amount of images being loaded on the fly. It made perfect sense to use Flash in this case. We could develop a number of optimisations to help the user interface to be as responsive and smooth as possible. One of the main goals was to keep file size low which sometimes is a main concern for clients using Flash. Nobody likes to wait so long for a 5mb website no matter how beautiful it is. However, having the opportunity to design something from scratch, do this well and use all advantages of Flash can offer it wasn’t difficult to keep final project below 200kb. I am pretty sure that with more time and graphical optimisation it could be even below 100kb. Oh, and one more thing; forget about PureMVC or other frameworks in this case. Frameworks themselves are a monster sometimes.

Parallax effect

To make the time-line experience even more interesting we decided to use many different planes and base on difference in the apparent position and move them across with different speed. That visual effect made interactivity more enjoyable however it did increase the level of difficulty of the project. From now on all the optimisation needed had to apply for every single plane and affect back-end development as well. During the movement, positions of the images were no longer fixed so it made it difficult to move them on demanding position. For this reason we had to build in some administration features to give a moderator the possibility to amend it.

Image container

The entire project was all about the visual content and image display. This element quickly became a crucial part of the entire structure and the main subject of optimisation. Keeping all the images constantly on the screen simply wouldn’t work. It also increased the memory consumption and took up precious processor cycles to render the timeline smoothly. Also loading all the images and unloading them when not needed wasn’t the best option. At the same time loaded content shouldn’t affect the user interface, so it had to be asynchronous approach. So, the image container is in fact deeply integrated with the custom loader system, internal caching solution and is constantly being used by the viewport optimisation algorithm that is checking those containers against a visible part of the screen.

With this approach garbage collector is maintaining memory usage and it let us develop a solution that can handle 500 images being loaded on load.

Back End

When you look at the whole picture this project is nothing else but a little blog system. Users can upload their own photos, post a comment and rate others peoples images. In addition to that they can also share posts and events on Facebook. For this reason we had to develop a more sophisticated registration/login system. There is a huge amount of data being transferred under the hood. And again, it has to be as small and efficient as possible. For this reason we couldn’t use standard xml as a dynamic data format. It is way to heavy and parser needed is too slow to compare to our custom protocol which is almost as small as AM3 format. Parser crunching all the information in one go.

PHP

This language comes in handy for Flash and Data Base communication. Giving us a lot of flexibility to do whatever we want to do and more importantly, can take intense calculations on the server side leaving more resources to the client. We decided not to use any framework since in our case it’s a bridge between Flash and MySQL. Files are very small and simple to make processing time needed on the 0.0001 ms level.

Data Base

It holds all the information as any typical blog system does. Nothing is too complicated

Facebook

These days more and more companies are using the power of Facebook to spread news about their projects to the world. In fact for us developers it means additional work and headache. It’s not a good practice to make your website completely dependent of 3th party solution. So, when comes to Facebook connect you thinking about both. There is many different ways to deal with Facebook and Flash.

However latest AS3 Facebook API base on latest OGraph is so easy to use that front end side of this integration took no more than 3 days. And this is what we have used.

www.30yearsofschuh.co.uk

Users are shown a slideshow of the key areas they work in from extensions, conversions, new build etc. The site is designed to be simple but informative and aimed at encouraging customers to understand what they do and make contacting the business easy.

From the website “We offer a broad range of architectural services to make your home more functional, beautiful and affordable. All our fees are pre-agreed at the outset, giving you certainty over your project budget. Work with My Architect and have your own professional architect, whatever the project size or budget, and your required level of input.”

Scott Batty of My Architect says “we really enjoyed working with By The Scruff- they are creative, professional and as their name implies- they seize the opportunity and make the most of it”. What nice words, we hope teh site attracts some good business in.

The website is fully manageable by their staff using the easy-to-use WordPress backend. We encourage all of our clients to write useful informative blog posts and Hut will hopefully be adding posts about their new projects thriugh the year.

For more details go to www.myarchitect.net

Take a look at 30yearsofschuh.co.uk and look out for the new site next month.

“Computing magazine is a well established information brand for senior IT professionals.  With consistently growing traffic to our mobile site, we were keen to engage more with these people and get an understanding of how they are interacting with the mobile platform.  In association with IBM, we came up with Smart Facts, a mobile site where users get facts about the effect of inaccurate data on businesses.  Users have the opportunity to find out more about these issues and enter their email address if they wish to receive an IBM white paper on the topic.  The mobile site also includes some poll questions to test the level of user engagement.

In order to achieve this we firstly needed a design for the mobile site and then some traffic drivers to encourage people to switch from PC to mobile to view the site.  With very little brief or direction, By the Scruff created a fantastic brand for Smart Facts and design for the site.  Both ourselves and IBM were immediately pleased.

Creating traffic drivers brought about a different set of challenges as we needed to encourage people to not simply view Smartfacts.mobi but they could only do so on their phone.  By the Scruff decided to create ads with phone number capture so users were prompted to enter their phone number and we’d send a SMS with a link to Smartfacts.mobi.  The ads look great and response so far has been very encouraging.

It’s always a pleasure working with By the Scruff, their ideas and energy is great and the product always comes out looking fantastic.” Louise Burry, Online Marketing Manager, Incisive Media

The company are moving into making specialist race parts for the Smart car and hope eventually to be running a championship in the UK later this year.

In the next month or so we will be adding a shopping cart with a full catalgue of parts that will be on sale to customers worldwide.

Best of luck to you boys! Find out more www.smarts4youracing.com

The banners will run on Sky and other portals for January to promote the signed merchandise on offer from some of footballs top names. Icons.com sell everything from players shirts to signed boots. Find out more here www.icons.com

If you would like to discuss this or any of our services then get in touch

Plumo is due to launch a new updated ecommerce website early in 2010 which will provide a more sophisticated shopping cart and better overall user experience.

The strategy will include keyword and competitor research, SEO, creating and managing  a blog, relationship management and other online PR related activities.

By the Scruff MD, Stuart Edwards, said ‘We are looking forward to working with Plumo who have a strong brand and loyal customer base, we need to spread the word and let more people know about their great range of products.  Our integrated marketing approach will be key to ensuring the ongoing success of this business and we are really happy to be a part of it.”

Visit the website www.plumo.com