Monthly Archives: September 2016

More Information About User Empathy In Web Design

THE BASICS
So why is it important? ED is about understanding your users, as well as the problems they may face – not just their goals. To truly understand this, some good old-fashioned research must come into play.

Research your users’ underlying needs, what do they really want from you and your service? What do they really want from your website? What need does your product or service fill and does your website communicate this? Step into their shoes and see your site from their perspective as best as you can. Explore your users’ stories and personal experiences. What are the underlying themes or questions here? How can the design and experience of your website meet these?

USER EXPERIENCE + USER EMPATHY
Is your site designed to truly connect with your users? Is it providing the best user experience? If your users are feeling detached from your brand online, it’s likely that your website isn’t taking a user focused approach. Think about how you can implement user experience and the practise of user empathy (UX and UE).

Focus on your users’ needs, feelings, experiences, and the outcomes they expect from visiting your website. UX and UE aren’t just pop-psychology, they are being used globally, in large organisations, to solve real-world business and innovation challenges.

DESIGN, DECISION, PROCESS
User’s come first, this is the position you need to take when embarking on the design process. It’s good to keep this at the forefront of your mind when you’re discussing your requirements with your creative team – use your research to guide your decision-making processes.

Even a seemingly well-functioning site, can take advantage of an empathetic approach. It’s important to a) do your research about what your audience needs, and b) step into your potential clients’ shoes, ask the hard questions, look at the themes and messages underneath all the marketing

Let the user’s needs guide your decision-making processes.

USER EMPATHY: THEY KEY INFLUENCERS
Technologies that know no boundaries and speak to all audiences.

For example: people from different cultures, and situational constraints, age and ability. If you are communicating with a broad or even a specific audience you must be mindful of this and incorporate this into your website’s functionality.

User testing: through research and site testing, you can gain a true understanding of how people behave, feel, and solve problems using your website or app.

Ultimately, successful User Empathy in web design is about human-focused design where empathy is considered at the very top of the design process hierarchy.

Special Tips For Brand Building With Web Design

First of all, what is a brand? A brand is a symbol. Symbols are designs which represent something else, and a brand is meant to package all of the associations, experiences and characteristics into an abstract construct.
This construct can be evoked using consistent imagery, sounds, phrases and logos with which people come into contact.

Brands are very important as they help you win customers and they also help you to keep them.
They do this by awakening the associations and experiences you previously had with the brand, or have seen through advertising, when you come into contact with the brand at key stages. For example, when deciding what product to purchase out of a selection of similar items.
Here are 9 tips to help you to build a brand with web design.

Brands set expectations, and when faced with uncertainty people tend to pick the safer option. People know what to expect from a brand they know.
Branding is a complex process that is performed across all types of media, from product packaging, TV commercials and magazine ads to interior store decoration and logotype design. Of course branding also applies to web design.
It doesn’t matter if you’re building a website for a multi-million dollar brand or a personal blog, branding still matters for the reasons outlined above. In the case of a personal blog, branding will help set you apart and make your site memorable.

1. COLOR
The choice of a good color palette is very important in branding. Color isn’t just aesthetics — it stimulates various emotions and carries with it subconscious associations to various things and characteristics.
For example, the color red may actually increase blood pressure, pulse and respiration. It’s a color that symbolizes passion, energy, power and excitement. Because of this, it’s usually a good color choice for brands in the entertainment industry.
Other colors carry different associations and effects. Green symbolizes nature, environment, profit, money and health. It’s also a calming color, which is why hospitals usually paint their walls pale green.
When picking a color for your brand, research its effects and associations to see if it is an appropriate fit for the type of things your brand represents. Also note that different cultures may associate the same colors with different things, so it’s a good idea to check that your colors mean what you think they do in the markets you operate in.

2. CHARACTER
Does your brand have character? Infusing your brand with a little personality can help you define what it stands for.
Is the brand all about stability and safety so that your customers can be sure to rely on you? Is the brand fun and down to earth?
Many people in commercialized societies use products and brands to define themselves, so shape your brand’s character towards something which your audience will like to associate themselves with.
Anthropomorphism is the attribution of human qualities and characteristics to other things, like animals or objects. Infusing your brand with anthropomorphic elements is a good way to give it character.

Think about the icon for the “Finder” application on Mac OS X. It’s a blue square with a distinctive smiling face drawn with a few black lines.
The program it represents is a file browser, but by giving it human characteristics the designers give it a soul.
Another great example is the Outlaw Design blog which sticks to a strong Wild West theme throughout the design with a unique mix of wooden textures and flat illustrations, branding itself very effectively:
Outlaw Design Blog

3. EMOTION
Emotion is another factor to consider when building your brand. What feelings and emotions do you want people to experience when they visit your site? What sort of things do you want them to associate with your brand?
Crafting the aesthetics of your site shouldn’t be about following the latest design trends, it should be about deciding on the emotions and ideas that you want your brand to project, and then working on a design that will do just that.

4. CONSISTENCY
To build a successful brand you need to make it memorable. What do you do to make people remember things? You repeat them.
Consistency throughout your web design will build on the choices you’ve made earlier regarding selecting the right personality for the brand and evoking the appropriate emotions. Keep consistent colors, visuals and typography throughout to ensure your website projects a uniform image.

5. REUSING CODE AND VISUALS
Consistent visuals and layout allows you to reuse more of your content, be it stylesheets or images. This means that your site will load faster as the user’s browser doesn’t need to download as many things — old images and CSS are already stored in its cache.

6. SIZE AND POSITION OF THE LOGO
The accepted norm when positioning your site’s logo is to put it in the upper left area of the page.
That’s the area where most people will look at to see what site they’re on. Additionally, it’s best practice to link the logo image to the site’s home page. But position is only one element — size is also important. Ensure your logo is big enough to be the second or third thing that people will notice when they arrive on your site.

7. VALUE PROPOSITION
When a visitor arrives on your site for the first time they take the first few seconds to orient themselves. Is this the right site? Does this look interesting? What is this all about? To answer these questions you should provide a clear and concise value proposition to your visitor.
This value proposition should be a short statement in a prominent location on your page. It should preferably be located next to the site’s logo so that when a new visitor reads the title of the site or business they’ll follow on to the value proposition.
In a few words explain exactly what benefit your site provides to the visitor, so that they’ll know not only what your site is about, but why they should keep using it.
Rob Sartain’s Prime Cut Design has a great value proposition in the header of their site. It’s highly visible, concise, and clear; and it covers both, the ‘what’ and the ‘why’:
Prime Cut Design

8. TONE OF VOICE
The language you use on your website needs to reinforce your brand’s character and personality. If your brand is a friendly and down to earth, and your audience are young, tech savvy people, then informal and fun tone of voice may work well for you.
On the other hand, if you’re making a website for an investment bank, the tone of voice should reflect that by being much more formal.
It’s not just about what you say — it’s about how you say it. You can say the same thing in different voices and get the same meaning across, but the personality that this voice emanates will be different; so choose a tone of voice that suits your brand’s character and audience.
Matt, a simple web app that helps you use multiple Twitter accounts, features hand drawn illustrations and a friendly tone of voice, ideal for the young, tech savvy audience:
Matt

9. UNIQUENESS
Getting all of the above elements will only get you so far though, because there is another very important thing to consider when building your brand: uniqueness.
If your website looks just like the competition, then is it really memorable? How would potential customers differentiate between the two? By putting in that extra effort to create a unique image you’ll not only stand out from your competitors, you’ll be more memorable, and that means a better chance that your visitors will come back for more.

WordPress Recomendation For Web Designs

WordPress has truly grown to be a powerful software program suited to practically any website application – from brochure style websites to portfolio sites, ecommerce websites, news sites and professional business websites. WordPress is not just for small business and bloggers anymore – here are the industry heavy weights that use WordPress as the force behind their websites:

News websites – CNN, New York Observer, Times, Forbes
Fortune 500 companies – UPS, eBay, Sony
Technology – Samsung, TED Talks, Mashable, Tech Crunch
Entertainment – Katy Perry, Jay Z, Justin Bieber, People Magazine
Fashion – InStyle, Style Watch, Modelina
Shortie Designs has been designing and developing with WordPress since we opened our doors in 2009, and we are continually impressed with the power and flexibility of the WordPress platform. Every website is able to be customised to our client’s requirements and each design is beautifully unique so that no two websites are the same. As design professionals, we like to keep an eye out on what others are producing on WordPress. Below are our top picks of WordPress website designs that are inspiring us right now.

ECOMMERCE WORDPRESS WEBSITE
Ca c’est Gang is a eCommerce website for a French street wear fashion brand. The minimalist design really allows the products to be the heroes in the design (which makes great sense when you are selling products online!). The website design is very intuitive, and it is easy to navigate, even if you don’t speak French. It also has one of the best looking cart and checkout pages we have seen, which gives your visitors a great user experience and helps convert visitors to customers.

WORDPRESS WEB DESIGN FOR A PROFESSIONAL WEBSITE
This website for a US building company is big, bold and interactive. Although it is a professional website, the design is far from boring. In fact, we find this website very engaging. The full width design makes great use of space, and the interactive elements beckon us to click through deeper into the website. The hover over effects on the Projects page are also very cool, and each page has a big red call to action which directs visitors to contact Arc. http://www.arkdevelopment.com/projects/.

BLOG WEBSITE USING WORDPRESS
WordPress has always excelled as a blogging platform, but this blog website (http://www.loftenberg.com/) has taken blog sites to a whole new level with a magazine style layout which really capitalises on the saying “images speak louder than words”. It also integrates with Amazon affiliate marketing, so that the website and blog content can be monetised.

WORDPRESS WEB DESIGN – ARTIST WEBSITE
Less is more is the only way to describe this beautiful artist’s website – http://phillipbutah.com/. It gives you the sense that you are looking at the work in a gallery; it is fuss free, there is lots of white space, and the artwork speaks volumes. This style of website can really work across industries and especially well for architects websites, property websites, designer websites, and personal blog websites.

WORDPRESS WEB DESIGN – USER GENERATED CONTENT WEBSITE
Teespiration is a wordpress website with user generated content. The public is able to submit their favourite t-shirt designs, you can vote for your favourite designs, and when available, a link is provided to where the item can be purchased. The website is a visual smorgasbord for anyone who loves graffiti art and street wear, and also serves as a resource for designers, graphic artits, illustrators, and photographers – http://teespiration.co.uk/.

INTERIOR DESIGNERS WEBSITE USING WORDPRESS
http://www.gardenerandmarks.com.au/ is a WordPress powered website by a pair of interior decorators. The website design showcases their distinctive decorating aesthetic, which can be described as eclectic, vintage and cultivated. We love how much attention to detail has gone into the design of this website, the theme has been carried through every element including the font and content holders.

TOURISM WEBSITE DESIGNED WITH WORDPRESS
This feature packed website is a great showcase of how WordPress can be integrated with social media. It has a Flikr photo feed, embedded YouTube videos, a Facebook plugin, and links to their active Twitter page. We also like how the branding permeates the entire site design, so that even the Facebook plugin looks like it belongs – http://www.buinzoo.cl

USING WORDPRESS FOR LOCAL BUSINESS WEBSITE
Billy’s Downtown Diner is more than just a local business website. This example showcases the scalability of WordPress and how it can grow with a business. This local diner is promoting all its extended business activities including a radio segment, events, YouTube channel, a blog and a book. Check it out at http://www.billysdiner.com/.

PORTFOLIO WEBSITE WITH WORDPRESS
This Pinterest style homepage is a designers dream. It displays a constant feed of design inspiration/ blog posts/ portfolio like a giant pin board. Each item clicks through to a page with more detail, and the content is cleverly organised in tabs, and displayed like a beautiful brochure. The fluid grid layout is responsive which means that the website content re-organises itself to suit the screen size, and the website will look great no matter what device you are using to browse the internet – http://www.strack.nl/

USING WORDPRESS FOR INFOGRAPHIC WEBSITE
This website is designed in a Infographic style which means it displays content visually in graphs and diagrams. This type of design has been very popular with businesses that want to make information more easily digestible and sharable (and hence it is more likely to go viral). This design is great as either a campaign landing page, or a way to release survey results, statistics and research findings back to the public. http://www.thisafterthat.com/

WordPress Powered Website_Mike Kennedy
All in all, we are continually impressed with the power and flexibility of WordPress, and it will continue to be Shortie Design’s preferred platform for developing websites. Visit our portfolio page if you are interested in checking out some of our WordPress websites. Or, get in contact with us to discuss your website project.