Pulling together a bunch of designers or companies to pitch for a web design project may seem like a wise idea but may actually work against you.

We previously talked about our new app, MockVault. It’s now available immediately for signups!

What is MockVault?

MockVault lets you manage your designs and versions with ease at the backend and present them professionally to your clients at the frontend.

To get a design approved, it’s not all about the design, it’s how you sell it. When sending a design to your client over the web, different format yields different results. If you’ve been sending mockups in PDF, Powerpoint or even in multiple JPEGs, your designs may not look like how it should be when it’s coded. This results in unnecessary requests for changes, wasting you time.

For over 13 years, we’ve tried and tested several ways of presenting our designs to clients. Only one format deemed the most effective in terms of getting it approved. It’s by placing annotations over the mockups and displaying it like the actual website.

The reason why annotations raises approval rates is because it’s easy for them to understand what they’re looking at. Guiding your clients through is critical if you want them to see the design the way you see it.

It is difficult to guide your client through your design over the web. With MockVault, it’s easy.

Check out MockVault!

There’s no surprise that more people around the world, not just Times Square alone, doesn’t know what a browser is, don’t use the internet as much as we would like to think, are less savvy and would get lost if the site is designed to be more complicated than they would have liked.

It’s a good place to start thinking about these users who are going to use the next website you design. Watch the following video and be surprised:

Found at: UX Magazine

I was skeptical at first, until a few experiments with HTML5 pops up across the web that caught my attention.

These experiments looks like they were built with Flash, but they’re not. What’s more, the performance was incredibly better than Flash.

Here’s two awesome examples (note: you need to view them on a modern browser eg. Safari, Firefox, Google Chrome, NOT IE6!):

Sketchpad

View it here ->

A stunning “Photoshop” like application built in HTML5. You don’t have to register, just start painting. Years ago, this was only possible with Flash, but not anymore.

HTML Canvas Experiment

View it here ->

This looks like it was done in Flash AS3 + Papervision or other 3D framework. But no, it was coded in HTML5 combined with a javascript based particle engine.

Flash, yesterday

Several years ago when Flash first made it’s debut, almost everyone who uses Flash are excited about creating the next flashy website, injecting the “wow factors” into every site they built by creating splash pages, lengthy flash intros, cheesy sounds, ambient or groovy background music with no “on/off” buttons, packing in lots of effects that either takes away too much of the users’ attention or having the user to wait too long for the website to load. Not mentioning weird interfaces and hard to use navigation systems which developers deemed “cool”. Though, I’m not denying the fact that I am guilty of some of the above mentioned in the early days.

Flash is Great But Prone to Being Abused

The great thing about Flash is that it is so versatile and flexible that you can build almost anything with it, websites, microsites, rich internet applications, games, mobile applications, desktop applications (AIR) etc, but the flip side of the coin is that Flash has been used irresponsibly by so many to make websites “as cool as possible” that it have earned some bad reputation over the years.

Loading Time

Take for example, when we speak to our clients about building their websites, they all share the same concern – loading time. Because that is the most apparent. Users don’t like to wait too long to interact with a site to start with as users have extremely short attention span today. Users these days have a queue of so many other sites to visit, news to read, blogs to follow, they have less reasons to wait another second. If you’re not convinced, ask yourself if you like to wait in a queue.

Among this common concern, bad utilization of Flash is more than meets the eye.

User Experience

In short, the user interface, the consistency of effects, the smoothness of transitions, navigation systems etc are some of the factors that contribute to the user experience. A layman can’t spell it out in details why they hate it, they just hate it. This makes user experience more of an “art” than a “science”. It’s the responsibility of the Flash developer to make sure they “don’t hate it”, by using Flash responsibly. Flash is resource hungry by nature, so don’t make it worse.

Keeping Flash Alive

Its the onus of Flash developers today to ensure the longevity of Flash. No more Flash intros without skip buttons. No more flashy and slow moving animations before the user can finally see the content. No more sounds without “on/off” buttons. No more launching a flash site in a pop up window from a splash page. No more launching the user’s browser into fullscreen mode without their consent. No more “experimental” or hard to use navigation systems that makes it hard for the user to learn, nobody likes to learn how to navigate a site anyways, when they use a door knob, turn on/off the lights, turn on/off the tap, they don’t have to learn in order to interact with it, so why do they have to on a website?

Splash pages

Think about it, do you really need a splash page? The whole purpose of splash pages was to inform users of the required screen size and it requires flash player to view the site, but you know what, who cares? Technology has been evolving faster than you can imagine, huge monitors are common these days, 1024×768 is the new 800×600 and 99% of internet users have Flash player installed. Lastly, please refrain from telling the user they need Flash Player 10 to view the site when it only takes Flash Player 8. And by the way, nobody likes to follow rules when using the internet, so please do your users a favor. Accommodate the user than have the user accommodate you.

Content Architecture

It is crucial to have a website planned out extensively in it’s skeleton form before anything else. Bad planning of a site leads to bad user experience, that is when users move their mouse to the top right corner of the screen and click the close button immediately.

As mentioned earlier, Flash is very flexible in terms of where you want to position elements of your site like buttons for example, but that doesn’t mean you can put them anywhere.

Flash Today

It has been several years since we have expressed our enthusiasm by releasing countless great or annoying flashy Flash sites, pleasing or pissing off countless others. It is time for us developers to grow up and to think more in the user’s point of view than our own.

Users these days are more content hungry than ever, leading to the rise of blogs that generates valuable content to meet user’s demands and at the same time monetizing their effort. This means more users are interacting with standards compliant websites more often than ever, giving them even lesser reason to learn how to navigate around a badly designed Flash site.

Being a good Flash designer or developer is more than just knowing how to script bells and whistles, it is how well the end user can interact with it that is the most important.

Here’s one that I developed for the movie 30 Days of Night (click on banner to replay) for Qais Consulting (I know, banner looks pixellated but this is what I call – compromise – for file size restriction), I would like to share with you my experience while developing this innocent looking banner which only weighs 29.7kb.

7 Points Checklist:

Here are 7 points to note when optimising your web banner. With this checklist, hopefully you won’t have to tear your hair out like I did. The final point I’m going to talk about using fonts which to me, is the most critical area of optimisation:

One more tip about developing your byte critical flash banner:

If you’re not sure which asset in your flash file is causing the increase in filesize, go to “Settings” at the “Properties” panel in Flash, click on the “Flash” tab and check the “Generate size report” checkbox. This will generate a text file listing all the assets that are used in your flash banner including their individual file size in Bytes, from there it’ll be easy to see who is the culprit at a glance.

For those of you who don’t know this yet, if you’re migrating from AS2.0 to AS3.0 or if you’re constantly using AS3.0 to develop your projects, this is a very handy ActionScript 3.0 Migration PDF reference. It clearly shows the difference between AS2.0 and AS3.0 and tells you what to import when using certain objects, it also tells you what objects has been removed in AS3.0. Certainly good to have it with you when developing AS3.0 projects or if you’re starting to learn AS3.0. There are also other cheatsheets for other platforms like AIR and Papervision which can be found here.