30th
June 2010
Read More
It’s been a while since we last peered down the sinkhole at the countless office-workers, bored partners and under-achievers who spend vast quantities of time wasting their lives on various websites.
Be it flash gaming, info-packed wiki-sites or aggregated cool content, we’ve been sniffing around the internet, looking for fun, interesting or downright absurd stuff for you to look at, read, play with and – most importantly – while away your time with. Prepare yourself, reader, as we once again send you off in search of procrastination. Good luck out there. And don’t get too addicted.
Starting this session off on a literary, intellectual level, Brainyquote.com is a cut above other quote-based sites in that it only seems to feature interesting figures and the clever words that tumbled from their mouths and were caught on record. I found it by accident while looking for quotes from political figure Nye Bevan. I not only found a wealth of them, but when moving onto quotes from Ginsberg, found myself clicking around the site all day, looking for killer quotes from people I’d only heard of in passing as well as established intellectuals and inspirational figures.
The site is particularly useful if you need to make an article you’re writing sound particularly brainy. Every good writer knows that quoting a great is the shortcut to making a halfway decent point. It’s not cheating, it’s using every resource available to you.
You know you have that fried who always seems one step ahead of everyone else when it comes to sending around viral web content? The one who’s always first with the latest video of a dancing cat falling into a paddling pool?
He’s annoying, isn’t he?
Well now you too can be the annoying pulse-fingerer in your friendship group, because Buzzfeed is the absolute Daddy of new, amusing and sticky content, absolutely filled to the brim with funny stuff. Sign up, and you can rate and submit content yourself. Often it will get lost in the void, but all entries are viewed by Editors who can give it a push up the ladder if they feel it’s particularly well made, or amusing enough to make the grade. You can also join in with the informed and frequently hilarious discussions below each post, as well as labelling and rating content with your own reaction, be it ‘LOL’, ‘WTF’ or ‘EWW’.
We would usually recommend you an entire gaming site, filled with time-wasting capabilities, but sometimes something comes along that wipes the floor with all the competition. Certain Flash games are described as ‘fiendishly addictive’. Well, Warzone Tower Defence isn’t just fiendish. It’s a demonically, diabolically and devilishly corrosive brain-worm. Tower defence games are often the kids of applications that can suck whole hours from your working day, but this one is essentially Tetris with really heavy weaponry. Everything about it is designed to suck you into its void. It’s the reason I’m submitting this article late.
Armed with a range of cannons, a range of anti-aircraft arms alongside flamethrower, pulse emitters and standard heavy machine guns, you’re charged with destroying an increasingly hardy fleet of enemy tanks and planes. At first it seems simple. Then they come at you in endless waves, and when they get to base they just plough on in there, destroying all your hard work in a battering assault. If you haven’t set up their route to your base with anything approaching insight, they will surely destroy you.
Having a bad day? So what. So are millions of other people, worldwide. What better way to feel slightly less awful than to check out the terrible, shameful, upsetting and downright unfortunate tales of woes from a worldwide submission base? FMyLife – you can guess what the ‘f’ stands for – is just that. Essentially a database of bad experiences, constantly updated to provide the miserable with a reason to be cheerful. At least you’re not the poor sucker whose best friend just deserted you for your girlfriend, and is now the proud owner of your beloved dog. Or the office worker who just got the blame for a string of nightmares that all occurred while she was on holiday. Or the guy whose mother is keeping him awake, singing the same song, on the toilet, drunk at one o clock in the morning.
FMyLife is also a particularly great resort if you’re having a fantastic day for once, and feel the urge to be silently smug as you indulge in the schadenfreude that accompanies feeling on top of the world as you cast an eye over the details of some poor souls rotten day. It feels a little bad, but it also feels very good.
As a reader of the Basekit blog, you’re probably web savvy enough to know what an Internet meme is. Just in case you’re not, Wikipedia has this: The term “Internet meme” refers to a catchphrase or concept that spreads rapidly from person to person via the Internet, largely through Internet-based email, blogs, forums, social networking sites and instant messaging’.
So – all the stuff you see on Buzzfeed (above) or receive in your inbox daily, or see littered around the web like an old joke half-remembered. Know Your Meme isn’t simply a collection of past, worldwide memes, but also sets out to explain their origin, the reason for the popularity and also traces how the trend changed over time. For anyone even only partially interested in web culture, it’s a guaranteed time-hole as you’ll see memes you never heard of, memes that pretty much passed you by as you couldn’t work out what was so funny, and some you remember all too well because they caused you to spit coffee all over your keyboard.
* * *
Enjoy your time down there. I’ve a game of Warship Tower Defence that needs my urgent attention.
This post was written by Liam Tucker of the excellent Watch With Mothers. Which is another great way to waste your day. – Want to write for the BaseKit Blog? – Drop us an email.
29th
June 2010
Read More
By now you should have a good, if not considerable, handle on designing a site. Now you need to worry about your target audience, so let’s talk about building your User Interfaces (UI) and your User Experiences (UX) with the appropriate age groups in mind and how you tackle certain hurdles that tend to pop up from time to time.
Designing for the elderly and children may be different than designing your everyday site. Older users enjoy a less cluttered and simple-to-use design. You have to remember that most previous generations did not grow up with computers, like most of us have, or are just starting to use one. My father still asks me how to forward his emails, and just now realized that you can listen to music on the computer. However, with networks like Facebook, more of his generation are using the internet and learning how to explore or even create their own sites. It’s often mentioned of me by my parents, relatives, and friends, ‘ask Josh, he’ll know the answer’, but how do I exactly know? By a process of trial and error and how my own mind has been trained to process information that is given to me. And if I don’t know the answer? Information is only a search engine away.
Older users want to be shown step-by-step how to use something, keeping in mind here that repetition is key to success. No one really ever gets something on their first try, so make any process or special feature plain and simple to understand. If your are providing a service, then think about providing tutorials, either written detailed instructions or video. You can never go wrong with an instructional video. It’s sort of like show and tell 2.0. This would also be a great time to suggest tips and tricks or maybe more offers that branch out from the original one. Always include a link back to the tutorial or help, but don’t make this process mandatory.
You often hear people complaining about not being able to talk to an actual person. While, for most of my generation, the ease and use of email suits us fine, other users may need or want that person to person support over the phone. Don’t over complicate it by adding chat support, most of the time your user will just wind up confused, but do make yourself available in both an online form and phone format to bridge that gap.
A picture is worth a thousand words and, in this case maybe a thousand future headaches. Using pictures along with you details or instructions can help save both you and your user countless hours of frustration. Usually, when setting something up, we look for the fastest route there is to accomplishing our goal. Your use of color also goes a long way, and I cannot stress that fact enough. When my father sits down at his computer, he always turns the background to a soft blue color. For him, having all of his icons on his desktop over top of an image is too confusing and he has a hard time deciphering the icons. Simplicity will carry your design a long way. Include ‘alt’ tags to your links, most of your users will not click something at random unless they know what it is or what it is going to do first.
When your target audience tends to be younger, like children, as I said previously, your use of color is critical. Soft and bright, but not overpowering colors, create a fun, enjoyable experience. Most of the children’s site are made with the interactivity in mind first. It’s a primal urge to touch and interact with items and this is especially strong in children. For instance, you may include a small game with a rewards system in place; this gives the user a sense of accomplishment and encourages them to explore more of the site at the same time.
How are you planning on designing with your target audience in mind?
This post was written by Joshua Rapp of Rappsody Studios – designing with beauty and function. Want to write a guest post for BaseKit? Get in touch!
Photo from Flickr user Spigoo used under CC Attribution License
24th
June 2010
Read More
I’m sure every designer has their own design process but I thought I would share mine and invite you to share yours. My process varies slightly depending on the project but follows the roughly same path.
1. Information Gathering
First of all I gather the majority if not all of my content. If I’m working on a personal project then this step is a lot easier as I will write my own text and I’m not dependant on anybody else. However if I’m are working on a client project it can be quite difficult to get all of the content needed before I even begin thinking about the architecture and layout of the site. If getting the majority of the content from the client at the stage is proving difficult, and let’s face it sometimes it can be very tricky, then I try to get enough information so that I can at least determine how many pages I’ll need and plan navigation.
I’ll also ask clients who their competition is, what they like and dislike about their competitors websites, what they want their own website to achieve and who their target audience is. I find this helps me to get a basic understanding of what the client is looking for in terms of both aesthetics and features.
2. Research
Once I (hopefully) have all the content and information I need to get started I begin researching. The type of project I’m doing will determine the nature of my research. If I’m working on a client website I’ll look at the websites of their competitors or at websites who share the same type of audience. I’ll take into account things that they do well and things that they don’t do so well.
I find this research stage useful for a number of reasons. For example if I was designing a website for a company who sold second hand cars and found that the vast majority of car sales websites all shared a similar navigation system or layout I would try to not stray too far from this system in my design so as so not to confuse users and allow them to navigate the site in a way they are used to.
3. Planning
At this point I’ll already have a few rough ideas as to how I’m going to organise the content into pages and sub-pages and how I’ll want users to navigate my site. I do the majority of my planning on paper; I find it easier to get all my ideas out on paper quickly without worrying about it being neat. Depending on the size of the site, I’ll scribble out sitemaps or flow diagrams; basically anything that gives me a clear understanding of how content will be organised and how users will find that content.
4. Wireframing
Once my content is organised into pages I start wireframing. Again, I usually wireframe on paper before I touch my laptop. I prefer using squared paper as I nearly almost always design to a grid based layout. I sketch out multiple layout ideas for different pages; header, footer, navigation, text, content etc. None of my sketches are particularly neat, there is probably only me that can understand them at this stage!
Once I have a layout and structure that I am happy with, I begin putting the wireframes together in Photoshop. Since I work to a grid based system I usually open up my 960px grid template PSD and translate my sketches into accurate, measured blocks in Photoshop. This way I know roughly how my layout will look on screen, how much space I have to work with for different features, if the page is too congested or too bare, roughly what size images I can use and a host of other things depending on the layout and content. This way I know if my layout will work before I begin the task of designing the visual elements.
5.Colour Scheme
I usually have a few colour schemes in mind from previous steps. If the client I’m working for already has a coloured logo or is a brand with established colours then the colour scheme has pretty much already been decided for me and I’ll just have to decide the best use for these colours, whether that be for headings, links, background colours, buttons, icons etc. If I have a free reign when it comes to deciding colours then I’ll usually play around on Kuler or design a quick moodboard. Moodboards are a relatively new concept to me but I have found them to be useful on more than one occasion. There is a great article on Boagworld that introduced me to the idea of moodboards.
6. The Design
Now I start designing the visual layout based on my wireframes. Sometimes I work on paper first, other times I’ll jump straight into Photoshop. At times I’ll need to design my own icons and graphics, sometimes the client provides them and sometimes I’ll use some of the great work that other designers have made available for use – of course abiding to terms of use!
When it comes to designing web layouts in Photoshop I’m obsessed with labelling my layers and grouping elements together, I find it saves me a hell of a lot of time later on when I’m looking for a particular layer!
7. Building the Site
Obviously if I’m working on a client project then I get approval on the designs before I start building the site. However if it’s a personal project then I can jump straight in once I’m happy.
At this point I start breaking up my PSD layouts ready for the web and then start the process of coding the site by hand.
However if coding seems like too much hassle, you can always use the BaseKit Website Builder which will build your website for you directly from your Photoshop design.
So that’s a quick overview of my process when designing a website. Is your process similar or do you take a different approach?
This post was written by Lee Harding of Lee Harding Web Design – creating modern beautiful and usable websites. Want to write for the BaseKit Blog – get in touch!
23rd
June 2010
Read More
That was one hard competition to judge.
We were completely floored by the quality and creativity of our community (we knew you were good, but still…!)
but, alas, there could be only one winner.
So, the design adorning the new range of BaseKit t Shirts is provided by Mr Ryan Astle – Here it is!
Larger image available over on our Flickr
We’ll be running many more great competitions, so stay tuned for the next one!
