Archive for the ‘Design’ Category
Does exactly what it says on the tin; just the posts that relate to the above...
Artist Who Painted Facebook’s Office Murals Is Worth $200 Million
If company had asked you to paint their new offices with a bunch of murals and offered to pay you a few thousand dollars or the equivalent in company shares, you would probably have gone for the cash, right? Well that’s what I thought until I found out that the company behind this was Facebook!
San Jose-based graffiti artist David Choe, was asked this very question back in 2005 by the then-President of Facebook Sean Parker. Choe painted graffiti murals for Facebook’s headquarters in Palo Alto, California and opted for payment in shares which is now worth $200 Million after the social networking giant went public on Wednesday.
Humm… maybe we could draw Mark Zuckerberg something and ask for a few shares perhaps!
New Adventures 2012 in summary
Earlier this month Phil and I headed off to Nottingham for round 2 of the New Adventures Conference. Last year was a massive success and a great way to open a new conference, which is aimed at being more affordable than most. This year Colly (now working with 2011 speaker Greg Wood on board) tried to mix things up a bit with an array of slightly lesser-known speakers.
Credit: CalEuanHopkins
All of the speakers delivered very professionally as you might expect. As is common at some conferences, the trend was for more “inspiration” based themes rather than technical learning or code examples. I think this works much better, and even though I would class myself more a developer than a designer I couldn’t help but be inspired throughout. My personal favourite talks were as follows:
Dan Mall
Credit: Littlemad
A great way to begin the day, getting everyone up and introducing themselves to the person behind them. He went into detail about his own personal design process, plus that working for Big Spaceship on projects such as Crayola and Star Wars! But humbly saying all clients are equal and still have to overcome the same problems. His idea of “Invisible deliverables” was great – things that the client never sees but are vital to ensure the success of any project.
- Twitter: @danielmall
- Slides: Dan Mall: Designish
Robbie Manson
Credit: Littlemad
Robbie’s talk was pick of the day for me. The delivery was impeccable and perfectly paced, powerful at times! I recommend you watch the full video below. He too talked about design process and argues it’s not linear, and that the best ideas happen when we are furthest away from the tools that produce them.
“the more invisible the tools, the more creative the thinking”
He values experimentation, quick sketching, exploring ideas quickly and with freedom before evaluating them. His idea of 6-up sketching is definitely one I will be using on projects in future.
- Twitter: @rougebert
- Video: Watch it!
- Slides: Robbie Manson: The Mindful Designer
Trent Walton
Credit: Littlemad
Trent’s obsessed with type and his talk was perhaps the most technical of the day, getting into areas such as HTML5, CSS3 and creative typography using jQuery. Right up my street! Using his Dad as an example of someone who is obsessed with their craft (in his case, Cars) he urged everyone to push the boundaries of what’s possible on the web without fear of breaking anything. How can the web evolve if no-one goes beyond? He also believes that failure is important, that mistakes are natural and perfectly fine as long as you learn from them and do things better on the next project.
- Twitter: @trentwalton
- Slides: Trent Walton: Break Everything
Everyone else
For a summary of all the other amazing talks, check out: the NACONF coverage page, Speakerdeck for slides, Vimeo and Flickr.
Overall
The talks this this year were very design-focused and it seemed each speaker kept to a similar theme, whether subconsciously or as curated by Colly. I think it’s great that the industry is becoming more open about design and design process as it is something which is not often discussed. Many of the talks examined our roles as designers, even in terms of the wider world, making a difference or starting our own design-based startup. Important ideas for me were ways to become more productive and think more creatively; by disconnecting from your devices, stepping away from your tools and resting or engaging the brain in other things!
Hats off to Colly once more for another amazing day. See you in 2013!
Mobilized Header & Footer
We’ve been working a lot on building responsive sites lately. Sites which are flexible to the device they may be viewed upon, and change accordingly. For many reasons, it’s good to start small and work up to a full “desktop” version and this means it is vital we consider the site on smaller devices early in the process.
Once we had produced wireframes for a recent project, I set about producing a prototype to see how the design would work across a range of screen sizes. The desktop site follows a very conventional layout but I was keen to see how we could best optimize the header and footer for those on mobiles or tablets.
Improving navigation
I had seen a technique used on Mark Boulton’s Five Simple Steps website to turn the primary navigation into a dropdown menu for mobiles (resize your browser to test!). Samuel Cotterall also wrote a script called touchdown.js to add this functionality.
Both these examples target a single set of links and make the navigation easier to use on a mobile device. In my example, I thought we could make better use of screen space and improve usability a bit further by grouping both sets of links together in the header (and footer). With some modification of Sam’s script I came up with the following:
View the demo or view on Github
The code that pulls this together is detailed at the above links. I also added a show/hide toggle for the Search box, a common feature on mobile websites these days where finding information quickly is paramount.
Not necessarily ground-breaking, but a neat solution which you might want to consider in your project. I can see it being extremely useful if you have a large footer with lots of columns / links you wish to group together.
If you have any questions or comments hit me up on twitter.
Christmas shopping
So it’s the end of the year and as many have been proclaiming, 2011 was the year of mobile. Well it’s certainly booming, as outlined by Bob a few months back.
The proof
Having been made temporarily flatless a week ago (long story!) and ending up sleeping on my mate’s sofa for a while, the only device I have had to complete the dreaded Christmas shop was my iPhone. Of course, during work hours it would be wrong of me to spend ages cruising Amazon (ahem!)
So how was my experience? Have to say I was pleasantly surprised.
Examples: House Of Fraser, John Lewis and Laterooms
Take a look at the three sites above; all large-scale sites I’ve visited during the festive season. They all have unique m. websites (and bloody good ones!) optimised for mobile devices.
In fact, in general nearly all of eCommerce the sites I visited had some sort of mobile site. This definitely wasn’t as common in 2010.
After a while if I visited a website which wasn’t optimised, it was an immediate turn-off. I believe that having a mobile strategy is now opt-out instead of opt-in, if you will. Consumers expect it and if you don’t provide then they will look elsewhere.
You’ve only gotta look at things like Amazon’s iPhone app and one-click ordering to see what consumers want – a streamlined experience that fits the context in which they are browsing. Testament to that is the amount of Amazon boxes that have landed in the office this week. At least 20 so-far!
Why user experience (UX) research?
Design flourishes within constraints
The more a design team knows about the users of a site, the better they can meet their needs and design something that appeals to those users beyond the aesthetic appearance of a site. Something that looks lovely but doesn’t work for the user is pointless online. The fundamental principles of user centred design are satisfaction, efficiency and effectiveness. To reach the ‘sweet spot’, design teams need to know what the user’s needs are for each of these areas. A designer has to have knowledge to make decisions; opinions and assumptions do not count when it comes to UX and usability. Getting direct access to users gives knowledge.
User experience designers
User experience designers are a specific type of user centred designers. They have specialist skills in collecting and analysing user research. The techniques used during both the data gathering and analysis are essential to ensure that the results are not skewed. With quantitative research like surveys, you have to gather a large enough sample size to ensure that the responses of ‘outliers’ (fans and haters) do not skew the results. So what method do we use?
Qualitative user research
Qualitative user research is the basis of user centred design. Give design teams access to real and representative users from target audiences before the design process begins, and they are provided with the information and ideas needed to develop their thinking and avoid designing in problems that need to be fixed later. Designers themselves need to have access to the representative users to do this; a connection with real users is required to fully understand their needs. With qualitative user research, you still have to ensure that you gather the right number of participants to collect information from; however, with proper recruitment and an experienced researcher the minimum number you can use is five. Research has determined that by conducting qualitative user experience work for a site with five participants you can uncover the vast majority of usability problems.
Find out more about qualitative research.
‘Usability studies’ and ‘depth interviews’
Usability studies are focussed on existing flaws within a site. Depth interviews are concerned with preventing flaws from being built into a new site. With both, the insight gained simply can’t be obtained from surveys or quantitative data sources because they do not elicit the information we need. We cannot gather the sort of feedback we need from questionnaires or surveys simply because nobody can write down and articulate the info we gather through qualitative research… and even if we could, it would lose its potency as it’s diluted through statistical analysis.
Do it yourself or use a specialist?
Using a specialist researcher gives you all of their past experience. As a moderator, our user experience expert Bonny has conducted countless hours of user experience work for organisations such as eBay. By running all these sessions for clients, Bonny has gathered a lot of experience in how to deal with participants and knows how not to be distracted by irrelevant data. Furthermore, she knows how to illicit responses that tell us what we need to know… not necessarily what we want to hear! This is a skill that is often not present with novice or new researchers who can easily be lead by responses through no real fault of their own. As an example, participants will often lie unknowingly; it’s a skill to know when someone is doing this and to dig deeper without letting them know that they have lied. If you do give this away you ruin the sense of trust between the researcher and the participant.
Mental model guru Indi Young has written some interesting points on conducting better interviews over on the Adaptive Path blog.
Roll with it… working with Oasis!
Not that Oasis!
We have created new branding and launched an online presence for Oasis, an ethical, not-for-profit human relations consultancy.
The branding and website are designed to help Oasis to clearly articulate its unique approach and skills, with much of the web content focusing on real-life case studies and testimonials.
Some might say…
Cathy Neligan, Communications Officer of Oasis says:
“Working with Mixd was an absolute pleasure. Their emphasis on getting to know exactly what we wanted meant we maintained an effective working relationship throughout the project and resulted in exactly the solution we needed. They came up with creative solutions for our branding, web and print, and we were able to rely on their expert advice and honest feedback.
“Feedback from clients and users on our new branding and website has been fantastic and we have seen an increase in enquiries and bookings through the website immediately following launch.”
Who and what is Oasis?
Oasis works with organisations to help them develop new and more effective HR and personnel management strategies. It’s clients range from not for profit organisations, charities and educational institutions to major companies such as Northern Foods, Skipton Building Society and Betty & Taylors Group.
The masterplan…
Built to the latest front-end standards in HTML5 and CSS3, the website really lives the Oasis brand and makes user interaction easy, even for such a content rich site. The jQuery animation on the homepage helps get across key brand messages with the site supported in all browsers (including iPhone/iPad) without the need for Flash.
The Executive Developers section allows users to easily search or browse to find the right developer for them, by name or region, and the Resources section allows free downloads of PDF Manuals and the online purchase of books utilising simple PayPal integration. The entire site is incredibly quick to load and navigate, by fully optimising both the front- and back-ends, whilst the search engines are kept happy by the ground-up integration of solid SEO practices that see the site sitting pretty on page one for many key search terms, even without an ongoing SEO campaign.
The website can easily be updated by Oasis through our adaptation and integration of the WordPress content management system which includes bespoke features including Custom Post Types to allow easy input of wide ranging content.
Don’t look back in anger…
Here’s what the Oasis site looked like before our involvement.
View the new Oasis School of Human Relations website.
A massive improvement wouldn’t you say? Definitely… no maybe about it!
Draw attention!
This has nothing to do with web design but if you are a web designer, training to become a web designer, would like to be a web designer or just like to keep abreast of the latest technologies and apps us web geeks are using then you might find this interesting. Then again you might not!
When we started Mixd nearly 7 years ago we were big fans of the so called ‘Devnet’. At the time we needed to find a quick and easy way of sharing design visuals for client feedback. There has been many ways of doing this over the years from emailing PDFs, emailing JPG images and god forbid, even presenting in person on white foam boards! We used to upload a JPG of the visual to our server in a client specific folder, and then email the link to the client with a paragraph explaining the design, the inspiration, the purpose of each element and so on. If you have been a Mixd client for some time you may well be familiar with this.
We still to this day use foam boards to present when meeting with clients and presenting a design to a committee. I can recall presenting logos to clients, each one carefully and painfully cut out and mounted on individual foam boards. I would then present each logo concept in turn, only showing the client one logo at a time and talking through the ideas as I presented them. Of course there were many tricks that were passed down to me. Always present and finish with your best work last and make your preferred logo slightly bigger so it would naturally stand out!
Mixd has gone all digital…
But wait, things have changed. The digital industry has moved on and so have we. We have recently been trying a number of different solutions for presenting visuals online. Included in these tests was Flickr – the online photo sharing network from Yahoo. This worked really well until we discovered Skitch.
So what is Skitch?
Well the inventors claim “We built Skitch to solve our own needs of sharing a visual idea, fast…”. It is a fantastic tool that is very quick and easy to use and allows us to easily send visuals to clients. Watch this 60 second Skitch tour to find out exactly what it is.
How we use Skitch at Mixd
Creating an amazing website is a collaboration between the client and us, the designers. We aim to work together to develop a design that is both visually stunning and effective at meeting business objectives. For this to happen both parties have their part to play and that’s why using tools like Skitch has really helped us. During the initial stages of design development the creative team can quickly share snippets of design visuals and ideas as they happen. Because it is so quick we no longer have to wait until we have a highly polished concept to present to client, meaning we get feedback quicker. We also use Skitch to test visual ideas and integrate this with other user testing we may be undertaking.
So whether you are a web designer or just need a quick and easy way to share ideas then perhaps Skitch is the app you have been looking for. Let us know what apps you use!
One careful owner…
If you’re in the market for a great deal on a used car in the Yorkshire area, you may have come across our recently launched website for Andrews Auto Parcs in Harrogate.
Website scoping
The website is the result of many hours of hard graft, with a great deal of time spent planning, investigating, scoping and ongoing user testing… to set the solid foundations that make for a structured, user focussed project. Early feedback from the client and users, along with analytics stats, is proving that it was time well spent.
Quality web design and development
Our usual standards of highly crafted code and user-centred web design are of course evident, with solid technical making complex processes, such as the finance calculator and vehicle search, easy for the user. This background technical is running using the fast emerging Ruby on Rails language and the integrated content management system allows the guys at Andrews (who will be the first to admit, that they aren’t very technical… hey, we can’t sell cars!) to take full control of their online presence from the comfort of their purpose built showroom.
Additional value added services
In addition, we undertook a photoshoot, developed a content strategy, advised on language and implemented comprehensive search engine optimisation for launch. Our work doesn’t stop there though – we like to take a proactive approach to evaluate and enhance our products – and we are currently investigating a smart-phone App and an ongoing search optimisation and pay per click campaign.
The website before Mixd’s involvement
Well, what do you think?
We’d love to know what you think about the site and if you’re in the market for a car, Andrews is well worth a visit… either online or in person.
Got pop?
I’m sure we’ve all heard the dreaded line before. As a long-standing joke in the design industry; when a client says about your design – “it just doesn’t…pop!”
What exactly is “pop” anyway? How can it be quantified? Surely it means different things to different people?
To me, it simply means grabs your attention. And something was unveiled this week which certainly did that.
The announcement of Red Pop
Charismatic creative Brendan Dawes is known for his obsession with all things design and seems especially excited by products. He recently founded Beep Industries to nurture this obsession; born out of his first product creation – the brilliantly simple MoviePeg.
Thursday saw the launch of Beep’s latest invention – Red Pop.
Sticking with the iPhone accessories market, Red Pop is an add-on to give you a more traditional camera ergonomic for your phone complete with shutter release button.
Straight away I knew they were onto a winner. How frustrating is it when you try and use your iPhone to take a photo only to fumble about trying to use the less-than-responsive capture button, missing exactly what it is you’re shooting?!
The product video and branding they have come up with is perfect – very fun and very “now”. Check it out!
I just love it. Such a simple solution to a genuine problem and a very elegant piece of kit, brought about with great attention to detail and clearly a lot of thought and research.
The product is only currently at working prototype stage, using Kickstarter as a platform to raise funding for a first production run. You can back the project on Kickstarter to help bring the product to market; although at time of writing they have doubled their funding target of $20,000 (in 4 days!)
Quite an achievement, and a sure sign of seeing this product in the future!
So there you have it. I know I will be first in line for one when they are released to the public. Hopefully the price will represent the simplicity of the product and knowing Brendan, the point of sale / packaging will be superbly made. You only need to look at the new MoviePeg point of sale to see that Beep really are an innovative company and ones to watch for the future!
Website for Obesity Surgeons Group launched
Harrogate web design company Mixd is proud to have recently launched the new website for the Obesity Surgeons Group based in Leeds.
The Obesity Surgeons Group (OSG) is a surgeon-led organisation that offers leading surgery solutions to patients revolving around four core principles:
- Highly skilled professionals with vast experience in weight loss surgery;
- State of the art, purpose built facilities;
- Provision of top quality after-care; and
- Sensible pricing structures that offer best value and finance options.
Mixd was approached by long standing online marketing partner 29Red to co-create a new website that would match up to the quality of the OSG service.
Accessible and usable website design
We were chosen primarily because of our experience in website accessibility and usability and our attention to detail. Throughout the project, a ’2 heads are better than 1′ approach was adopted with key decisions being made by everyone involved and the end result reflects this. Specifically, our work included:
- Full planning, investigation and scoping;
- Creative;
- Client content management system;
- Technical development;
- Online BMI calculator (what’s your BMI?!);
- Illustration and video animation; and
- Accessibility and usability consultancy.
We’d love to know what you think of the Obesity Surgeons Group website, so do let us know… …and why not check out you BMI online whilst you’re there!
Stop press… soon to be seen on TV!
Professor Mike McMahon, lead surgeon at OSG and a pioneer in keyhole gastric surgery, will be appearing on Channel 4′s Embarrassing Fat Bodies in May; a spin-off from the ever popular series Embarrassing Bodies. ‘The Prof’, as he is affectionately known, was selected because of his skill level and will feature as the weight loss expert who consults and operates on one of the programme’s patients with a particularly tricky and complicated case.