Simon and Brodie - Simon's 40th Rat Pack partyI am sitting on the sofa at work, taking a breather after a year of fun and adventure, for both Frontend and my personal life. Frontend made double figures by reaching 10 years and I turned 40.
We celebrated our 10 year birthday with catered lunch at the bunker, sipping back on a few bottles of Veuve Clicquot. Brodie, my fiancé, and Sandy our copy expert provided a yummy feast for the team. It was great to say thanks to the team who I really enjoy working with every day, in a collaborative way.
I am also excited by turning 40 in November and asking mi more Brodie Reynolds to marry me at my 40th Rat Pack party - what a moment which has left me floating high on a fluffy white cloud.
This year we made a conscious effort to bring in a high level strategic component into our process. This has been key to identify the customer proposition and the gaps and the opportunities, then identify what channels and functions to meet those customers. We have partnered with Kostia Shinderman from Alphero, who's company focuses on digital channel strategy development with a core focus on mobile.
Now we see ourselves delivering across multi-channel from website to iPhone apps and iPad and each having a specific purpose to touch and engage customers at the right time.
Next year we see a huge growth opportunity in creating business apps for smartphones, which needs to fit into the big picture of how you engage with your customer.
So if you are not sure where to start, the best way is to storyboard current and future-view customer journeys, which will help realize opportunities to pursue.
I am very much looking forward to 2012 being a turn-key year for businesses embarking on mobile strategies.
I'll sign off by saying thanks to my team of Corinne Gibson, James Ing, Kelly Milligan, Graeme Dickey, Dan Clausen, Quan-Lin Sim, Rebecca Tansley and Sandy Hirstich and of course our friendly clients, who we enjoy collaborating with.
Smell the roses and have a Merry Christmas with those you love.
What I look like after a few days in the office without sunHi everyone, today's post is just going to be a casual chat about making sure we all look after ourselves and both mentally and physically.
As designers our days are spent meticulously crafting and creating our craft. So dedicated are we to this that we often work to the determent of our bodies. With summer arriving soon it means warmer weather and more hours of daylight. It's a timely reminder that we should also remember to keep ourselves healthy and live a balanced lifestyle that allows us to continue what we love doing for longer.
Get out of your cave
Graphic design is hardly an outdoors activity (excluding 'special' meetings with beer). We often find ourselves inside for most of the day basking in the glow of our monitors. During winter it's not unheard of to get to work before the sun is high in the sky and leave after it's decided it's had enough of hanging around.
Vitamin D is produced in the body from exposure to sunlight. It's no surprise that when Néstle worked along side the University of Sydney they found 42% of their office works were deficient in Vitamin D. What can we do? Simple get more sun. But how? Well the sun is generally outside so I suggest starting your search there (mileage my vary).
Move about, and stretch it out
Typical office worker's neckAnother concern is the amount of time designers and general office work has us sitting down. Our ancestors toiled the fields, built shelters, and hunted dinosaurs (I assume). Though physically demanding, it meant they moved about. Quite the opposite of the modern office worker. Sitting down for extended periods can have all sorts of terrible effects on the body from terrible posture to shortening your life span. What should you do? Take the occasional break, and just walk around a bit and stretch out those muscles. Don't over stretch, but just enough to ease up a bit
Stop thinking about stuff and or things
Find an outlet for stress, else end up like an awesome 90's movie (Falling down)What about the noggin? In many industries such as Graphic design, it's hard to completely switch off from work, even when at home or on holiday (I'm very guilty of this). I've left work stewing over a problem on Friday, only to have it suddenly hit me with a possible solution on a Saturday night (alcohol often helps in this regard). This can be problematic for those around you, as you're never quite out of work mode. There's no one solution I don't think. But I've found finding a new hobby or interest you can invest in mentally helps your brain from wandering back into work mode whenever it gets a chance.
So what should you be doing? I don't know, but I'm looking forward to scuba diving out and about and getting my vitamin D quota
James
The online space has a weird way of repeating itself. Unlike print, the online space hasn't got hundreds of years of history to look back on. Instead it has a few decades, each with its own little leaps of technology that push the boundaries of what's possible. With each new leap we often find ourselves repeating the past, mistakes and all.
Early websites were designed for a standard monitor size of 640px by 480px. This was the total screen space- we still had to subtract the size for the top toolbar and footer, leading to an even smaller viewable space. Over time monitors have become larger and with it we've seen an increase in usuable screen space.
Generally we design websites for the initial content to fit within a standardized view port of 960px x 600px (-ish). This vertical height represents the 'fold'. The 'fold' is an old term taken from newspapers, referring to the point where the paper was folded in half. Content above the fold is instantly viewable so would be used for the more important information.
Designers initially avoided putting content below the fold as the user often avoided scrolling. The alternative was to make separate pages, so an article may have been broken up into 4 short pages all appearing above the fold. Over time users learned to love scrolling (you probably don't even notice the sound your mouse wheel makes anymore). This change resulted in webpages becoming longer without the worry about content not being seen below the infamous fold.
Flashy animations and cool effects have always gone hand in hand in web. I myself have been guilty of indulging over the years (including my old Geocities website with twinkling, animated gifs). Flash then took over as the 'go to' program for creating animations and 'cool' effects. This lead to the abuse of effects and transitions. We ended up with full flash websites that were incredibly bulky and hard to update. Flash has largely been replaced with JavaScript libraries like JQuery which help smooth out the regular issues of JavaScript inconsistencies across browsers.
So what do all of this have in common with today's topic?
"With each new leap we often find ourselves repeating the past, mistakes and all." - James, this very same article.
In the mobile space we've often been limited to much smaller screen sizes. We've had to design pages with tiny dimensions, within a tightly confined space. You end up with lots of little pages with very little content. With the rise of smartphones we now have the chance to design in spaces not too dissimilar to regular websites. Mobile websites are once again trimming down pages and spreading content too thinly. Often it is due to constraints in technology (cost of mobile data, etc), but in my opinion sites should give users the option between a mobile and a regular version. This way it gives the user the power to choose between the full or diluted experience based on their situation.
Smartphones have also given rise to the application marketplace. These apps can range from the light hearted 'band name generator' to more complex apps designed to help people maintain a healthy lifestyle. Apps allow developers to create more complex interactions and animations than mobile websites often can permit. This unfortunately has lead to some developers abusing this system once again.
A few online magazine apps appeared on the release of the Apple iPad that meant that users could subscribe to and download online magazines full of great interactive material, videos and images. This led to extremely large, clumsy apps that looked great. But it also meant these apps have inherited all the problems of old flash websites- large downloads before users can see content, flashy interfaces which make it difficult for users to navigate and have made it hard for developers to update and maintain.
New technologies allow us to push the boundaries of what is possible, often allowing us to refine past ideas. Just remember some old ideas are better left in the past.
App design is pretty new ground for us at Frontend, but damn we're loving it! Here's a few tips and useful resources we've picked up so far.
Application design is huge right now. Whether you're designing for the relatively mature iPhone market, slightly greener Android market, or adolescent tablet market theres a lot of fun to be had!
Our experience at Frontend with apps has been an exciting and challenging one. Web is our bread and butter, but those web things we're so good at don't necessarily translate to a good user experience on-device. The first place to start is here: the iPhone Human Interface Guidelines. There is a lot of usability material in here that comes in so handy at all stages of app design. When you are squeezing so much into such a small area, usability and user interaction define the line between a frustrating user experience and a brilliant one. These User Experience guidelines are especially valuable.
The iPhone's retina display displays a whopping 640 x 960 pixels. Thats wider than this blog column, but on a 3.5" screen. This really opens up a new level of detail for designers. every pixel difference you make may seem small, but combined they form such a sharp and polished interface you just can't get on a computer screen (yet...). Consider a texture that is usually too fine to be seen on a phone screen, this is a perfect example of there you can really push these tiny details to your hearts desire.
Tip 1 - Use Adobe Photoshop! We are big fans of Adobe Creative Suite here at Frontend. Illustrator is an invaluable tool, but when you want to form a pixel perfect, easily dissectible group of graphics without vector output being required - photoshop comes out on top.
- Apply all your styling through the styles panels, you will change things over and over again to get it exactly how you want it. Even colour objects using the 'color overlay' style. It will save you tons of time!
- Keep your layer structure organized! If you don't already, make the effort.
- Set up a nice boiler plate which you can iterate to add new views to your application design
- Save a selection of 640x960 pixels at the perfect place for screenshots (read below)!
Tip 2 - Use the excellent resources available to you - There are excellent resources available for designing on the iPhone. A prime example is the Teehan + Lax interface sheet. This contains a bunch of vector based standard iPhone elements for you to use during mock-up phases! This file provides you with actual size elements you can drop into your own file and rapidly prototype with. Just keep in mind that its only for Mock up purposes.
Tip 3 - Test your designs on the iPhone as plain images. It's so simple to see how your interface will look at its actual size and colour. Simply load up your 640x960 selection (mentioned earlier..) and copy a merged version of your design. Email this to yourself and opening it with your iphone. hit 'Save image' to save it. Go into your iPhone's photos section, open up the screenshot, tap on the screen to dismiss the top and bottom bars. Voila! perfect representation.
Be open to the challenge that app design brings. It brings with it bucket loads of strategy, thinking and innovation which can often be put on the backburner in web. We're looking forward to more!
That's all the tips we have time for this week folks, please tune in for a later post on app design. Any questions, comment below or flick us a message on the contact page
One of our team recently gave a talk on the use of grids in web design
During the course of this talk, the term 'golden section' inevitably came up and how it played an integral part in calculating the grid. Like most of us, I know a little about this 'golden section' but decided to try and find out a little bit more...
Firstly, it seems that the purpose of this 'golden ratio' is to give a sort of harmony and beauty to what ever art form it is applied to. It's application can be found in art, sculpture, photography, design and even music. It is said to naturally appear in nature (although this has been disputed) and has recently been found to exist even on a molecular basis!
It is said to have been “discovered” by the greeks back in 500BC and can be found in their architecture and sculptures. Along the way, it has also been utilised by the Egyptians and Aztecs in their pyramids, and Renaissance artists and composers such as Leonardo Da Vinci and Mozart. It has also recently been made famous in movies and programmes such as “The Da Vinci code” and “Num3ers”.
So what exactly is this golden section (also known as 'phi') and why all the fuss? Basically, 'phi' can be described in a mathematical formulae where 'a line that is divided into unequal segments will always (when calculated) equal the sum of the length' or '1.6180339887...' for short. This formula can then be applied proportionally to 2D & 3D objects and space. Of course for those of you keen to investigate the intricacies of this formulae, there is a wealth of information out there on the internet...
For those of us more interested in it's practical applications, it seems that you can apply this formulae to practically any artistic endeavour you are working on and we sometimes intuitively do it without even realising. It does however appear that when you consciously apply the golden section, you will achieve a more harmonious outcome which will evoke a more emotive and aesthetically pleasing reaction in your audience... Strangely enough, it doesn't appear that we know exactly why it causes this emotive reaction, just that it does.
So before you start your next artistic endeavour (whatever that may be) it might be a good idea to think about your old friend 'phi' and what it can add to your project. :-)
[With thanks & acknowledgment to Tony Xia and of course the interweb!]
Comments