Optimisation is a core element in building any successful product regardless of whether its a website, an app or even a game. But optimisation isn’t just about keeping the file size down its about providing the most fitting possible solution for any given task.

When optimising we think about value, usability, readability, communication and personality as well as the more traditional foundations such as SEO and load times. Covering all these core concepts will ensure you have a delicious product.

So how do we do it?

Throughout each step of design, development and testing we think about these core principles based on our collective experience and through experimenting. Here is one such example…

For one of our top secret projects we have in development we have two large containers which you can navigate between, we found that having a drop shadow these containers caused a subtle but noticeable lag when animating in and out. As with any project there is always more than one technical way to active a task so we brainstormed potential fixes which would allow us to keep the design with a drop shadow.

We decided to trial our current method (A), animating css position values, against CSS Transitions (B). To stress test the demo each container was filled with 2312 child elements all individually coloured and with opacity. The parent containers have the same drop shadow as we intend to use in our project.

Method B out performed A quite significantly in each of the tests. Spending just a little bit of time on this problem helped ensure we had a buttery smooth animation. Although this is a very specific example this logic is used each of the optimisation tests that we run and is essential to making great products.

You can view this test here…. but remember it is a stress test so it may crash your browser.

If you’d like to discuss your startup or project, get in touch with Simpleweb today.

Related Stories