

Germany, which is situated in the heart of Europe and neighbors nine other countries, is not only the motherland of eminent philosophers, poets, composers, world-famous automobiles and great beer, but also a place where some of the most talented and highly ranked Web designers live.
German design is certainly worthy of respect and a delight to the eye of anyone who takes the time to observe it. For years, we have accumulated knowledge, upheld eternal principles of style, simplicity and accessibility, adopted best practices and kept up with the latest global trends. I’m proud to present here a showcase and discussion of world-class German Web design.

German Web Design: jung von matt
State Of Things
The creative industry in Germany is extremely competitive and consists of thousands of freelancers, studios and agencies. We have the pleasure here of presenting a brief interview with several German design gurus to lend some insight into the local design scene. As talented creative professionals, blog and book authors and freelancers, they are passionate about sharing their knowledge with others. Our participants are:
- Prof. Fons Matthias Hickmann, graphic designer, typographer, Professor of communication design at the University of the Arts Berlin, Director of Fons Hickmann m23 design studio, author of “Beyond Graphic Design” and “Touch Me There” books;
- Mike John Otto, founder and Creative Director of blackbeltmonkey design studio;
- Kai Becker, Creative Director at Elephant Seven agency;
- Christian Bartsch, Associate Creative Director at Neue Digitale / Razorfish agency;
- Dirk Ollmann, freelance Creative Director;
- Markus Angermeier, design freelancer;
- Björn Seibert, Web designer, information architect, founder of the Webzeugkoffer blog, and author of the book “Professionelles Webdesign mit (X)HTML und CSS”;
- Dirk Behlau, graphic designer and photographer.

creative style agentur
Question: Could you please describe the current state of the German design market. What is the life of a freelancer, developer or designer in Germany like? How much do designers earn?
Prof. Fons Matthias Hickmann: Working with interesting and open-minded people is not something you can take for granted. And earning money by doing what you love involves luck.
Mike John Otto: The current situation for good designers, developers and especially freelancers is surprisingly good. That strange year 2009 wasn’t as bad as many thought it would be, and there was a big demand for good creatives with experience to help realize projects at agencies. As many bigger agencies reduced their team sizes, freelancers were highly welcome, and I honestly think that shrinking in such a “crisis” always benefits the quality of creative projects, because people try harder to prove themselves with good work instead of just doing their job.
Kai Becker: I think 2009 has been a hard year for designers. Although we had a lot of work (compared to conventional advertising agencies), many clients cut their budgets, which often meant less time for the design process. I also missed jobs in which the design or idea played a leading role. Briefings were very conservative or half-hearted and often came with a very reduced budget. A screen designer earns around €2000 to 2800; from there on you’d be an Art Director. Most of them earn €2900 to 4000, but a few earn a bit higher. Freelance screen designers earn in the range of €150 to 250 per day, Freelance art directors get from €300 to 500. Because conventional agencies had to sack quite a few designers, a lot more freelancers have been available in 2009, and as far as I know they have had a hard time.

Armin Morbach
Christian Bartsch: I think we have the perfect market right now for small studios and freelancers. All the big agencies tried to build up knowledge of digital services in the past five years to be more integrated. Those that failed now have to to work with specialists and independent freelance networks to be competitive. Clients want their 360° communication, and you need professionals for that. A lot of these professionals, including myself, can be found on Design made in Germany, a platform for German designers. Money-wise, I would say it is the same as everywhere else. If you are good, you’ll be booked.
Dirk Ollmann: The financial crisis had a strong impact on the freelance market. I know a lot of them were starving and sleeping under the bridges in Hamburg. Just joking. Life is not that bad, but agencies tried to manage all of their work with their own staff, and so hiring freelancers was a no-go for the last two years. Now the market is rising again, and the fact that agencies were very cautious and kept their staff counts low will now help freelancers. An art director can earn between €300 and 500 a day, depending on his skills, quality and speed.
Björn Seibert: Web designers and developers are working — surprise, surprise — as freelancers and employees. Freelancers work more on interdisciplinary projects and teams. The employees work in small specialized agencies, in bigger full-service agencies and large industry enterprises. I would guess the majority work for small to mid-sized businesses. But overall, I don’t think that this is particular to the German market.
Working as a Web designer or developer is rarely a 9:00 to 5:00 job. Your income depends of whether you work as a freelancer or employee. Secondly, it depends on whether you work for a small agency or large enterprise. It may also depend on education. Employees can earn from €35,000 up to 50,000 or even more. As a freelancer, it depends on your market, target groups and customers. As a freelancer, you can and should ask for an hourly rate of at least €50 and up.

sven kils – graphic studios
Dirk Behlau: Hmm… I have been working as a freelance graphic designer and photographer for ten years now, and I have been lucky enough to develop Pixeleye Interactive (my business) from year to year. I mainly work for international lifestyle, car and custom-bike magazines and top brands. For example, I was in Mexico with the Finnish rock band Leningrad Cowboys in the fall of 2009; we will produce a photo book and DVD documentary together. All I mean to say with this example is that I am not sitting in my office every day from 9:00 to 5:00. I travel a lot, meet cool people and a lot of new things happen. So no day is like another, which keeps me motivated. How much do designers earn? That depends on how “established” you are in the business… I have all I want and can make a good living out of it.
Question: Are there any patterns of usability or rules of thumb that are typical of German design? Are the standards of Web design in Germany changing?
Prof. Fons Matthias Hickmann: Although the Web is completely different from print or anything else we thought we knew, you can still apply your principles and tastes to Web design. At the moment, almost anything is possible, and that makes it exciting.
Mike John Otto: Well historically, German design has always been really clear and straightforward. On the one hand, everything produced in Germany, including the design, is usually very precise and content-driven. On the other hand, I see a new trend of more experimental designs that try to break out of grids and usability patterns. As globalization hits every one of us, and with one click anyone can see what is highly rated in other countries, German designers are trying to develop something new, a new German design language, as happened on the German music scene before.
A new German aesthetic language that still hasn’t quite developed but will hopefully soon be as strong as the German music and art scene is today. The most creative areas in Germany currently are Berlin, Hamburg and the Frankfurt am Main area. A lot of smaller German design and digital studios pop up and do remarkable work far away from daily advertising work, even if the big networks still play a bigger role in the German creative scene than they do in, for example, the UK or Sweden.

{ths}
Kai Becker: I wouldn’t say so. This is a difficult point, but I can’t see anything explicitly “German” in Web design from here. Standards are always changing, but I think that affects Web designers and developers worldwide.
Christian Bartsch: The design culture in Germany is still very young. With the rise of Berlin as one of the hot spots in Europe, German design has taken a big step. We had and still have a lot of influence from Spain and France. If we speak of Web design, Germany always has been competitive in the global market. You will find a lot of German projects on The FWA.
Dirk Ollmann: For me, as a creative director who has worked on a lot on big brands in the car and consumer goods industries, the financial crisis has had a huge effect on marketing strategy and the process and technology of the Web designer. It turns out that the short-term “return on investment” is more important than long-term brand building.
Today, analytics is the driving force in Germany. But what effect has this had on Web design? The trend is “back from Flash to HTML.” This is the technology that works best with Google’s search engine. Actually, the new BMW website design is based on HTML. Last year’s Web designers were expected to have a lot of skill in Flash and inventing new navigation concepts and visualizations. Now, we’re going back to the roots of Internet, keeping it very simple, do everything that Google wants and trying to sell the product with a few clicks. That’s it.

bellyshades
Björn Seibert: First of all, I don’t think there should be a special rule set for a specific national market. We and others are working hard for a common understanding of Web standards, usability and accessibility around the world. There could be derivative or special requirements for special markets or target groups. But there is foremost a strong demand for international and widespread standards by which every designer and developer can build websites and applications of high quality and a high level of user experience.
Spurred by the Web standards movement in the US, and led by “General” Zeldman and his combatants, the Web standards movement accelerated very quickly in Germany as well. Many of us in Germany started thinking about those standards and proposed best practices. In 2005, Jens Grochtdreis founded the Webkrauts. The Webkrauts are working hard on doing awareness training for Web standards and best practices in Web design and development. Their publications help to educate others and point to obstacles.

colibri – contactlinse & brille
Question: How important is professional education in the design industry, and do you feel that the education available in Germany is adequate to develop world-class designers?
Prof. Fons Matthias Hickmann: Professional education is very important, and more open-minded and sensible young talents are out there than ever before. I am anxious for them to take over soon.
Mike John Otto: I truly believe that all world-class designers have an innate feel for design but have also learned and shaped their skills at art school and by working in agencies. So yes, a professional education is not only important but essential, and a few very good ones not only teach students creative and software techniques but open their eyes to art, design history, common trends and design rules as well as things like film, theater and marketing. Nowadays, design students who are looking for jobs have to know much more than they did a couple of years ago: about film, conceptual thinking, advertising rules, digital trends such as social media and online campaigns, to name just a few.
These so-called “digital natives” have a much wider range of techniques and hardware to mix into their daily work than I had when starting out in the business in 2000. This is a big opportunity and a big pain at the same time. Every good school has to prepare to students to meet this wide new range of market needs.

figurenschneider puppenbau norman schneider, bielefeld
Kai Becker: For advertising agencies, your portfolio matters the most. I judge designers by the work they have done already, not if they have studied the right thing. And yet Burg Giebichenstein in Halle, Germany, is the place that develops world-class online designers. If you can make it there, you’ll make it anywhere.
Christian Bartsch: I think professional education shapes your style and keeps you focused. I experienced big differences in quality at German design schools. After four years, I transferred because I was unsatisfied with the conditions at my school. Design is evolving. Multi-touch and augmented reality offer new ways to approach content. Interfaces are becoming more and more complex. Some schools still think in paper.
Dirk Ollmann: Of course, a professional education is essential. It speeds up your talent. But learning your craft is only one aspect. You should also use your university or design school to meet people and network. World-class designers? Of course there is enough room for them in Germany. Have a look at the biggest multi-touch wall made by Sensory Minds!

MWP Online
Björn Seibert: This topic was the subject of my latest article for the German “Webstandards Magazin” (Issue 4/2009). And yes, I think there is a need for more professionalism in terms of education and orientation for job starters in the field of Web design and development. Indeed, we are seeing a bit of action with apprenticeship; people who study digital media and design have the opportunity to do some specialization. But so far, there is no special degree course or job training that fully concentrates on educating Web designers and developers. In my opinion, there is still a lot of work to do in offering more professional education and better safeguards to hopeful professionals — safeguard that would keep people from thinking that any Web design job could easily be done by their neighbor’s son.
Dirk Behlau: Nowadays, getting a good education is becoming more and more important for someone to be successful in the design field. There are a lot of good people out there. I started 15 years ago as a full auto-didact, developing my own style and look. Designers coming from university are often very impractical in normal “office life.” They may have learned how to use programs like Photoshop, but they don’t have the experience to be successful in their business. Self-marketing and self-promotion are very important, and these are not taught very well in universities.
Question: Where do you get inspiration from? How do you stay informed about the latest design trends? What books and magazines do you read?
Prof. Fons Matthias Hickmann: Like almost everybody I speak to about inspiration, I feel overwhelmed by the amount of information we process every day from the Web. A few websites are clever and thoughtful, giving insight into the creation and process of design, rather than just showing random pictures. Where do I get my inspiration from? From every form of culture. And from daily life. The Web now plays a part in both.
Mike John Otto: I get my inspiration from a mixture of influences: Hamburg and Berlin’s night scenes, youth culture and their dress and music codes, travelling, music magazines and my daily work with colleagues and students from my class. Of course, I check out design websites such as The FWA, High Floater and Digital Arts, as well as magazines such as PAGE and IdN, but I don’t get inspired by checking out other design work. True inspiration comes from fields such as music, theatre and story-telling. Sometimes new ideas are born of these influences, and sometimes one kind of recycles all of this stuff and creates something new from it.

visualorgasm
Dirk Ollmann: Before you design, you need an idea. I think this is the most difficult thing. A lot of designers use the Internet to try to come up with a unique idea, but that’s the last place to find it. I try to keep my eyes open for things that happen in real life… keep my eyes open and record. After a while, you have a database of ideas waiting for implementation. Stop working, get inspired! Ideas will come by doing something completely different. Try something! I use to pet my cat, kite-surf, play bass, etc. Nevertheless, there are some websites I check regularly: Behance for random searching (those are some cool guys from Eastern Europe); for style, The Cool Hunter is one of my favourite websites; and The FWA for state-of-the-art Flash design.
Björn Seibert: A normal day starts with Google Reader and the Twitter timeline. These are my main sources of information for keeping up to date on Web design trends and issues. Actually, I’m subscribed to about 230 feeds, mostly covering design, Web design and development, usability and user experience topics. Further, I’m subscribed to some Posterous blogs. I love to discover small new unknown blogs with good and relevant copywriting. For me, inspiration is nothing you go out looking for. It starts with good content, smart insight into Web design issues and smart solutions to common problems. I read a lot of Web design-related books. Lately: Sexy Web Design, Designing with Web Standards, Integrierte Informationsarchitektur. At the moment, there is only one magazine I’m willing to pay for, the quarterly Webstandards Magazin.

iconwerk
Dirk Behlau: I travel a lot, meet new artists and exchange ideas with them. And I do read a lot of magazines and check websites, blogs, social network websites, etc. So, I do look everywhere, and I’m interested in a wide range of themes from movies, music, video games, travel, lifestyle, hot-rodding, custom culture, skateboarding, custom bikes, graffiti, tattoos, to name just a few. I do get a lot of magazines from around the world every month, covering everything from cars to tattoos to music. I love the Juxtapoz and IdN magazines.
Question: Are there any other issues unique to German Web design? Do you see any remarkable differences in comparing it to creative industries worldwide?
Prof. Fons Matthias Hickmann: One obvious difference is the language. English is omnipresent on the Web, German is big as well. How should we deal with that? Is translation a good method, or an alternative? How will our culture change? What can we do as designers?
Mike John Otto: Not really. British, US and Swedish influences are big in Germany, and so the product is becoming more and more similar. A German design and Web design language is being formulated more and more but is still not strong enough. Most of the German work seen at award shows and in magazines is still mainstream from a handful of very well-known German agencies. Although German ads and design are winning more and more at award shows: Germany was in the top five in quite a few rankings this year. I hope a remarkable difference will show itself in German design sometime soon.

Moargh
Kai Becker: There may be slight differences between European, Asian and American Web design, but I would not say they are remarkable. Perhaps German Web design is typically straight, clean, simple and tidy. Kind of what you would expect from a German, wouldn’t you? :)
Christian Bartsch: Right now, Flash development is particularly good in Germany. Small studios such as blackbeltmonkeys, Less Rain and Artificial Duck are pushing the limits.
Dirk Ollmann: Germans are often seen as “number crunchers” — that’s absolutely true. The big brands always want to know what the results will be before we do anything, and we try to avoid any mistakes. The result is that we miss a lot of opportunities that the Internet provides. But maybe this is a worldwide problem as well. Styles and trends? I hope German Web designers will kill glossy 3-D buttons, wet-floor shadows and those ’80s trend next year. Website design will evolve into big clear typography, short copy, only a few themes per page, big easy buttons and a lot of video content.
Making videos will become increasingly easy, and we’ll turn away from the high-end glossy advertising grease. Even big brands will host their videos on YouTube or Google Video to allow users to embed. “Sharing” will be the driving force of content and Web design in the coming years. The biggest task of brands will be to conquer social networks like Facebook, MySpace, etc. But most brands have no idea how to achieve this. For me, this is one of the most interesting fields in advertising today.

das leben ist wie eine schachtel pralinen
Björn Seibert: I generally have a more global point of view. But what must be emphasized is that a line of German Web design has emerged. There are a bunch of very talented Web designers, and the Web standards movement is upon us, in no small part thanks to the Webkrauts initiative. There is also a highly recommended Web-standards podcast Technikwürze that covers the latest Web design trends and features the best from the Web in Germany. But I think that sometimes we should be more self-confident and share with each other our thoughts about modern Web design and current issues.
Dirk Behlau: That’s difficult to answer because I work for international clients that demand my particular style. Sometimes I think European and American clients are more experimental.
What’s Going On In Germany?Events
A number of design and tech-related events happen in Germany on regular basis. Some worth mentioning are Forum Mediendesign; Designers’ Open; webinale ; WebTech, DesignCamp (January 24-25, 2009 in Cologne). A famous international arts festival, “Illustrative,” was held this year in Berlin.
Awards
Among the most prestigious awards in the German design industry are the red dot design award, iF communication design award, Designpreis, Gute Gestaltung, Deutscher Multimedia Award (DMMA), BIENE-Award and LeadAward.
Showcase Of Web Design In Germany
In this showcase, we bring you a selection of the most inspiring and well-designed websites in Germany, either personal experimental or corporate.
friseur hamburg – rolf & bernd

Junopilot

pisto – magazin über web und die welt

erfolgreiche webseiten und marketing-kampagnen aus hamburg

Kaiserschnitt Hair-Styling

bieh.de

tanner + tailor

oliver twardowski, addicted to coffee

dinge geregelt kriegen – ohne einen funken selbstdisziplin

Michael Heinsen

artcore-illustrations

flaek footwear

Bianca Elmer

kinderspiele, malvorlagen, kindergeburtstag

stefan velthuys – web & frontend-designer

stilvolles webdesign, printdesign, illustration und animation

noel nieto – strassenfussballer

high quality writing instruments

bauer konzept & gestaltung

andreas mühe

visionpixel mediendesign

NerdFilms

Jägermeister

J. Konrad Schmidt

Donate-a-meal

Kubis Welt

Julius Brink & Jonas Reckermann

Irrland

Lukas Lindemann Rosinski

Diet Riot

The Lotus Eater

Holsten Pilsener

Paulaner

Allude Cashmere

Ochs Schmidhuber

Arthur Schlovsky

Marc Aurel

Carsten Mell

Michelbergerhotel

Kubikfoto

Pritt World

Supergid

Kiri Spass

Neubauladen

Telemaz

Designschneider

Andreas Hinkel

Wendt & Kuehn

Santamaria Tour

Isabel Abedi

Kultika

Quintezzense

Wild Web Woods

Mustafas Gemüsekebap

My Lane

photocase – kreative stockfotos

misfall – t-shirt

habitat seven – very flexible

cape arcona type foundry

vier für texas *ideenwerk

wm team – showtime for your brand

xplicit ffm / grafik – und webdesign aus frankfurt

Showcase Of Design Agencies
The design sector in Germany is dominated by a number of highly professional creative agencies that have earned international public attention and many prestigious awards: among them the red dot design award, iF communication design award and Designpreis.
Scholz & Volkmer
Clients: Mercedes-Benz, Adidas, Samsung, Coca-Cola

recom
Clients: Adidas, American Express, Audi, BASF, BMW, Bosch, Braun, Canon, Chevrolet, Citroen,Douglas, Ehrmann, Fiat, Ford, Gerry Weber

Mutabor
Clients: Adidas, Audi, BMW, Breuninger, L’Oreal, Nivea, T-Mobile, Volkswagen

Tilt Design Studio
Clients: Audi, Belmondo

Saint Elmo’s
Clients: BWM, Lufthansa, AxelSpringer

GNC Design
Clients: HTC Deutschland, Ford Deutschland, Renault Nissan Deutschland

Toca Me
Clients: Amway, BMW, Burda, Compaq, Fujitsu Siemens, Henkel, L’Oreal, Mc Donalds, Microsoft, MINI, Müller Milch, Novartis, Red Bull, RitterSport, Sony BMG, Vodafone, Xbox

hauser lacour
Clients: Bayer, Berlin Chemie, Commerzbank, Lufthansa

urbn;
Clients: McDonalds, Adidas, Sarotti, Hasseröder, hohes-C, L’Oreal

blackbeltmonkey
Clients: Mitsubishi, Edeka, FC Bayern, Chelsea FC

Taobot
Clients: Beck’s, Coca-Cola, Commerzbank, Deutsche Bank, GfK Group, Jay-Z, Leica Camera, Mercedes Benz, Metro Group, o2 Deutschland, Smirnoff, Swarovski, ThyssenKrupp, Toblerone

Moccu
Clients: L’Oreal, Garnier, Volkswagen, Deutsche Telekom, Vodafone, Dior, Maybelline, WWF, Canon

Goldener Westen
Clients: Axel Springer, Coca-Cola, Edeka, ZKM Karlsruhe

MetaDesign
Clients: Volkswagen, OTTO, Conrad, Audi, Klett Verlag, Lufthansa, Nici, eBay

Aperto
Clients: Audi, Bayer, BenQ, Coca-Cola, F.A.Z., Siemens, Sony, Triumph, Volkswagen

Loved
Clients: Adidas, Audi, Comdirect, Görtz, s.Oliver

Antwerpes
Clients: Aral, Bayer

Are We Designer
Clients: BASF, Burda, Deutsche Telecom, Vodafone

Marctropolis
Clients: ARD, Beate Uhse, Bild, BMG, Burger King, Chupa Chups, Procter & Gamble, Red Bull, RTL, Siemens, Skoda, Universal Music, ZDF

Parasol Island
Clients: MTV, IKEA, Sony Ericsson

Fiftyeight
Clients: DHL, Mazda, Milka, Lacoste, Jaguar, RTL, Nintendo Deutschland, Disney, Procter & Gamble, Ferrero Deutschland, Karlsberg, Nike, Renault Germany, Warner Music Germany, Sparkasse, Opel, MTV

Showcase Of Web Design Freelancers
Besides the professional creative agencies, we find a lot of freelancers working in the industry.
United States of Design
Clients: Adidas, Audi, Bacardi, Berliner Sparkasse, Bertelsmann, Coca-Cola, Deutsche Bank, Mini, MTV, Mozilla, Plazes, Sprite, Siemens, Sony, Sony Ericsson, TDK, Volkswagen

Martin Anderle
Clients: Adidas, BMW, Sony Ericcson, Volvo, ZDF

kosmar
Clients: Stiftung Warentest, Daimler, SPD Berlin, Plazes

Dirk Schütze
Clients: Leibniz, Konica Minolta, Deutsche Post

Radekal
Clients: Gillette, IKEA

mediziehm
Clients: Peugeot, Ford, Jaguar

Matthias Dittrich

Sugah Design

psychosystems

Thorsten Konrad

sieben:null

chez-boo

Hoan Luu Duc

David Hellmann

C.L.I.T.O.R.I.O.U.S

Round-Up Of German Design Resources
To stay competitive and successful on the creative scene, we have to know what’s happening in the fields of Web design, Web development, graphic design and typography and know what trends are set to become the next big things in the design world.
The round-up below of over 70 design-related resources should give you an overview of German blogs, Web design galleries (both CSS and Flash), communities, social networks and magazines (both online offline). You would be well advised to read or at least occasionally look through these to catch up on the latest design trends and get a daily dose of inspiration and encouragement. I invite you to discover some of these unique and enjoyable resources!
Blogs
- Das Web Design Blog
- Design Tagebuch
- Pixelgangster
- Pixelgraphix
- Colurz.de
- Webzeugkoffer
- Dr. Web
- Farbwolke
- Zwiebeltisch: Magazin für Gestaltung
- Create Or Die
- Webstandard
- Designpicks
- A List Apart
-
Posted: January 26th, 2010, 3:00am EST
In Part II, dig deeper into the technology behind using SVG for your site design. Explore how to incorporate SVG in a cross-browser friendly manner, including using SVGWeb to ensure that the SVG shows in Internet Explorer. And discover the unique characteristic that makes SVG ideal for page backgrounds: scalability.
-
Posted: January 26th, 2010, 3:00am EST
Many of us think of Scalable Vector Graphics (SVG) as an also-ran: fine for charts and tables, but not much else. Yet SVG can actually enhance a site’s overall design, and can be made to work in even the most stubborn browser. In Part I of a two-part series, Shelley Powers covers important basics of working with SVG, including browser support and accessibility.
-
Posted: January 25th, 2010, 7:48am EST by ZURB


Previously in this series on CSS3, we talked not only about how to create scalable and compelling buttons but about how to effectively use new CSS3 properties to speed up development and quickly create rich page elements. In this final article of the series, we’ll really get into it and use CSS3 visual effects to push the envelope.
Not everything in this article is practical, or even bug-free, but it’s a fun primer on what’s in the pipeline for Web design. To get the most from these examples, you’ll have to use Safari 4 or Chrome. (Firefox 3.5 can handle most of it, but not everything: WebKit is further along than Gecko in its tentative CSS support.) We’ll show you how to create impressive image galleries, build animated music players and overlay images like a pro. All set? Let’s rock.
Create A Polaroid Image Gallery

We always try to stay pretty active with our Flickr feed; our chief instigator Bryan does a great job of capturing the day-to-day and special events and even some of our old work. We wanted a great way to show off these photos, so we turned to CSS3 to create a compelling, fun image gallery. The Polaroid style is pretty common, but we wanted not only to make it dead-simple to create the gallery in the markup but also to add styles that would have required Javascript just a year or two ago.
The Polaroid Gallery Markup
First off, we created very simple markup for the gallery, something that would be easy to generate automatically using the Flickr API. The markup for the entire gallery looks like this:
<ul class="polaroids">
<li>
<a href="http://www.flickr.com/photos/zurbinc/3971679981/" title="Roeland!">
<img src="image-01.jpg" width="250" height="200" alt="Roeland!" />
</a>
</li>
<li>
<a href="http://www.flickr.com/photos/zurbinc/3985295842/" title="Discussion">
<img src="image-02.jpg" width="250" height="200" alt="Discussion" />
</a>
</li>
</ul>
We’ll be using the title element in a minute.
The Base Style and Labels
Our next step was to create the simple Polaroid look. We placed our image inside an anchor with a white background and scaled the image container. This gave us space for the image labels, which we created using little-known CSS tricks: :after and content: attr.
ul.polaroids a:after {
content: attr(title);
}
What we’re doing here is telling the browser that after it renders the given anchor content, add another piece of content. We then generate that piece of content with the content: attr(title) element, which pulls a specific attribute from the element, in this case the title attribute. Using alt would make more sense, but neither Safari nor Firefox has implemented it for the content element.
The snippet above tells the browser to take the title attribute and render it immediately after the content. Note that the title attribute will be rendered within the anchor, which is exactly what we want. We would have liked to have used the alt attribute, but Safari and Firefox do not support the use of content with it.
Our styling of the anchor element takes care of the formatting of the title attribute as well, and we’ve now placed the image title attribute below it so that we don’t have to replicate that content in the markup.
Scattering the Pictures
A handful of Polaroids would never be in a perfect grid; they’d be scattered over the table. We compromised by messing up the grid a little bit for each image: a little rotation here, some displacement there. However, we did not want to have to manage that scattering on a per-image basis, so we used another new pseudo-class: nth-child.
/* By default, we tilt all images by -2 degrees */
ul.polaroids a {
-webkit-transform: rotate(-2deg);
-moz-transform: rotate(-2deg);
}
/* Rotate all even images 2 degrees */
ul.polaroids li:nth-child(even) a {
-webkit-transform: rotate(2deg);
-moz-transform: rotate(2deg);
}
/* Don't rotate every third image, but offset its position */
ul.polaroids li:nth-child(3n) a {
-webkit-transform: none;
-moz-transform: none;
position: relative;
top: -5px;
}
These are only a few of the declarations we used; we actually added them for everything up to 11n, but you get the idea. As you can see, nth-child supports a few different arguments, including even, odd and Xn (where X can be any integer). The even and odd declarations are self-explanatory. Xn takes every Xth element and applies a particular style; in this example, every 3rd. Combining this with odd, even and some more Xn declarations means that even though the style won’t really be random, it will appear random enough to the average user. You can see the entire set of styles on our demo page.
We’re using a new CSS3 property here as well: the CSS transform (shown as -webkit- and -moz-transform). The transform property can take a number of arguments for different kinds of transformations; in this example, we’ll be using rotate and scale. You can see the complete (tentative) list in the Safari Visual Effects Guide.
Some Final Animation
Our last touch was to give the image focus on hover; in this case, to enlarge and straighten out. We accomplish this using a -webkit-transition that is activated by the :hover pseudo-class. Check it out:
ul.polaroids a:hover {
-webkit-transform: scale(1.25);
-moz-transform: scale(1.25);
-webkit-transition: -webkit-transform .15s linear;
position: relative;
z-index: 5;
}
What’s happening here is that we’re overriding the existing -webkit-transform to simply scale the image (this eliminates the rotation). The -webkit-transition tells Webkit-based browsers to animate the transform so that the move from one to another is smooth. -webkit-transition is actually extremely versatile, because it can just as easily support color, position (top, right, etc.) and most any other property.
That’s how we created our Polaroid gallery. Once you know these new tricks, putting them together is actually pretty easy, and the markup is dead simple.
See the Live Demo »We’ve created a live demo page for this gallery in our Playground, a place for us ZURBians to create small side projects and samples of cool toys. We’ll be linking to the Playground examples throughout this article.
Sliding Vinyl Albums With CSS Gradients

This example began as a simple experiment with CSS gradients and grew into a pretty detailed investigation not just of gradients but of new background properties and animation. We’ll show you how to create advanced gradients with no images and use layered backgrounds for some cool effects.
Writing the Markup
What we’ve created here is a simple unordered list of albums with slide-out album controls. You could use something like this to present your band’s albums or to showcase a series of podcasts or any other kind of audio (or potentially video) media. Each item in the list is an album, with some fairly simple markup:
<div class="album">
<a href=""><img src="http://www.smashingmagazine.com/playground/sliding-vinyl/muse-the-resistance.jpg" width="500" height="375" alt="Muse: The Resistance" /></a>
<span class="vinyl">
<div></div>
</span>
<ul class="actions">
<li class="play-pause"><a href=""></a></li>
<li class="info"><a href=""></a></li>
</ul>
<div>
<h5>Muse</h5>
<small>The Resistance</small>
</div>
<span class="gloss"></span>
</div>
It might look like a few extraneous elements are in there, but we’ll be using all of them to render our slide-out record and controller buttons.
Creating the Record
The real trick here was the album. We challenged ourselves to create the album without using any images at all (we ended up cheating a bit, but we’ll get to that). When it slides out, the album looks like the figure on the left: standard black vinyl with a slight shine to it and a couple of control buttons.
You’ll notice that the inside edge of the album is a little jagged, and that’s because the album isn’t an image but rather two layered gradients generated by the browser and set as the background of the same object. This required not only a bit of messing around with the new gradient objects in CSS3 but also another CSS3 trick: multiple backgrounds. Check out the CSS for the record:
ul.tunes li div.album span.vinyl div {
display: block;
border: solid 1px black;
width: 112px;
height: 112px;
-webkit-border-radius: 59px;
-moz-border-radius: 59px;
-webkit-box-shadow: 0 0 6px rgba(0,0,0,.5);
-webkit-transition: all .25s linear;
background:
-webkit-gradient(
linear, left top, left bottom,
from(transparent),
color-stop(0.1, transparent),
color-stop(0.5, rgba(255,255,255,0.25)),
color-stop(0.9, transparent),
to(transparent)),
-webkit-gradient(
radial, 56 56, 10, 56 56, 112,
from(transparent),
color-stop(0.01, transparent),
color-stop(0.021, rgba(0,0,0,1)),
color-stop(0.09, rgba(0,0,0,1)),
color-stop(0.1, rgba(28,28,28,1)),
to(rgba(28,28,28,1)));
border-top: 1px solid rgba(255,255,255,.25);
}
We’ve omitted some of the positioning and other boring CSS pieces (check out the live demo for the complete markup). We want to focus here on the pieces that are critical to creating the album visually: border-radius and -webkit-gradient.
The simplest part was creating a round object: by setting the border radius to exactly half of the height and width of the object, the browser masks the object to a perfect circle. Watch out, though: unlike in Photoshop, if the border radius is higher than half the object’s height or width, the browser might simply ignore the declaration. That said, rounding the object is the easy part; the tricky part is controlling the gradients.
Two gradients are at work on the object: one creates the album itself (complete with the hole in the middle), and the other casts a light across it. We’ll start with the shine:
ul.tunes li div.album span.vinyl div {
...
background:
-webkit-gradient(
linear, left top, left bottom,
from(transparent),
color-stop(0.1, transparent),
color-stop(0.5, rgba(255,255,255,0.25)),
color-stop(0.9, transparent),
to(transparent)),
...
}
The shine gradient is a linear gradient from the top-left to bottom-left. We start with transparent so that the gradient fades in, then we shift the gradient to white at the 50% mark (halfway across the album), with 25% opacity. We’re using RGBa colors because they allow us to control both the color and opacity in the same declaration.
The album itself is more complicated, and it suffers a bit from early implementation of the radial gradient.
ul.tunes li div.album span.vinyl div {
...
background:
...,
-webkit-gradient(
radial, 56 56, 10, 56 56, 112,
from(transparent),
color-stop(0.01, transparent),
color-stop(0.021, rgba(0,0,0,1)),
color-stop(0.09, rgba(0,0,0,1)),
color-stop(0.1, rgba(28,28,28,1)),
to(rgba(28,28,28,1)));
...
}
Radial gradients are just as they sound, and just what you’d expect from gradients in Photoshop. They begin at the center of the object and track across the object in concentric circles. In our case, we wanted to start with transparency, then switch to a solid black, and end up with a very dark gray.
Perhaps the most difficult part of the gradient is declaring its size and position: radial, 56 56, 10, 56 56, 112. We have five pieces of data here: type, starting center, starting diameter, ending center and ending diameter. Here’s how they work:
- Radial is, of course, where we define this as a circular gradient rather than straight (linear) gradient.
- We begin at 56 56, which is exactly half the height and width of our 112-pixel-tall object. We want the gradient to end with the same center, so we repeat 56 56.
- The gradient begins with a diameter of 10 pixel.
- The ending center (56 56) ensures that this is a concentric gradient.
- 112 is our final diameter, the same width as the object.
The radial implementation was still a bit rough around the edges, so we played around with these values and the color-stop elements to get the effect we wanted. In the future, a more polished implementation won’t be quite so trial and error.
From there, similar to the linear gradient, we created a series of color-stops to go from transparent to black to dark gray. The result of these two backgrounds (separated by a comma—thanks, CSS3) is our shiny record. Again, you’ll notice the center is a bit rough, but we’re sure future implementations of this new element will be cleaner.
The button controls are simply rounded anchors (using border-radius), with a couple of image glyphs (we told you we cheated a bit). The final touch was to add the animation so that the album would roll out of the sleeve on hover.
Adding in the Final Animation
To achieve the rolling effect, we paired up a position shift and a rotation effect so that, as the object moves to the right, it rotates just the right amount to appear as if it’s rolling. Here’s what we did:
ul.tunes li div.album span.vinyl {
-webkit-transition: all .25s linear;
}
ul.tunes li div.album:hover span.vinyl {
-webkit-transform: translateX(60px);
}
ul.tunes li div.album:hover span.vinyl div {
-webkit-transform: rotate(120deg);
}
We’re using two transforms, translateX and rotate, on two objects. We use the translate instead of standard positioning because transforms don’t impact the DOM—from a layout perspective, the object never really moves, and so we don’t have to worry about floats going awry or objects pushing each other around. Transitions also work better on translation transforms than on actual position (left: 20px, etc.) changes.
Gradients have a ways to go, but there are already some cool uses for generated gradients. You can even control them at runtime using transitions or JavaScript, which opens up yet more possibilities.
See the Live Demo »We’ve created a live demo page for this gallery in our Playground, so you can see it in action and delve deeper into the source code. Enjoy!
Sweet Overlays With Border-Image

This last part is perhaps the most practical. We use it in our feedback tool Notable every day. The border-image property is new but has some really interesting applications. We’ll explain how it works and how we’re using it in our flagship application.
The Overlay Markup
Overlays in Notable have two parts: the frame and the actual glass overlay. The markup for the overlay is pretty simple, consisting of two sibling DIVs:
<div class="note" id="note1">
<div class="border"></div>
<div class="overlay"></div>
<span class="black circle note">1<span class="wrap"></span></span>
</div>
When we created these overlays, we had a few goals:
- They shouldn’t overly obscure the content beneath them.
- They shouldn’t affect the hue of the content beneath them.
- They must look awesome.
To that end, we devised an overlay that would appear as a glass overlay, with a slight shine and a nice, fairly bold frame. For the purposes of this article, we’ll focus on the frame, which we created using the new border-image property.
Using Border-Image
The new border-image property is a strange beast: very versatile, but takes a little getting used to. Here’s what the border-image declaration for our frame looks like in the CSS:
div.note div.border {
border: 5px solid #feb515;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-image:
url(/playground/awesome-overlays/border-image.png) 5 5 5 5 stretch;
-moz-border-image:
url(/playground/awesome-overlays/border-image.png) 5 5 5 5 stretch;
}
Let’s get the easy stuff out of the way. The border element is both required and a fallback: older browsers will still render a usable border for the overlay, but border-image requires a defined border width. While we’ve been fairly unconcerned with backwards-compatibility in our articles, in this case we needed it (Notable has to work in more than just cutting-edge browsers). This is one of many examples of progressive enhancement (or graceful degradation, if you prefer): older browsers render something usable, just less pretty. The first progressive piece in here is the border-radius, which we’ve already discussed at length.
The border-image is what we’re interested in. Check out the figure to the right; notice the gradient on the frame that goes from top to bottom? It’s a simple touch, but adding it to an object that has to scale to many different sizes required that we use this new property. And we’re glad we did; learning how to use it opened up new possibilities in our coding repertoire. Let’s look at just the border-image code again:
url(/playground/awesome-overlays/border-image.png) 5 5 5 5 stretch;
The syntax is the same for WebKit and Gecko(Mox) browsers. The actual declaration is simple. What takes some effort is understanding how to create the image file itself.
Border image takes a single image and slices it into nine pieces, which it then stretches over the object. We’ve sketched a diagram to explain how this works, and we’ve blown up the actual border image file for you to compare. Check it out:

The browser takes the top-left corner and uses it for the top-left border, and then it stretches the top-middle to cover the entire top of the object, and so on around the image.

We created an image with transparent center, because border-image will stretch the center quadrant across the entire object (which seems counterintuitive for a “border” image, but it does make the style a bit more versatile). You’ll notice that the actual gradient is present only in quadrants 4 and 6, because those are the only pieces that will be stretched enough for us to see a gradient. The browser actually does a good job of stretching the image as long as it’s not too complex, so artifacts aren’t really an issue.
The last pieces of the border-image declaration are the size and style: 5 5 5 5 stretch. The repeated 5s determine the size on each side of the object; because we wanted a 5-pixel border, we created an image that was 15 x 15. If we had used a smaller image, the browser would have had to scale the corners as well, and no doubt it would have looked messier. The last property, stretch, dictates how the browser actually handles the pieces of the image. A great (and amusing) intro to the different styles can be found at lrbabe.
Putting It Together
Combining the frame with the glass overlay center (which is a semi-transparent PNG) gives us our frame. Using different border images, we actually created classes for our different colors (red, blue, etc.), while older browsers still get a usable frame without the gradient-edged niceties. This isn’t an incredibly complex example, but you can see how useful border-image can be, especially using an alpha-mapped image format such as PNG.
See the Live Demo »We’ve created a live demo page for this gallery in our Playground so that you can see it in action and delve deeper into the source code. You can also read up on why we created this overlay in our two-part Notable Behind the Scenes blog post: part 1 and part 2.
CSS 3 Is Totally Bad Ass
Right? We hope you’ve enjoyed this primer on what we can look forward to in the final CSS3 specification. Familiarize yourself with the properties and start using them—just be sure to account for browsers that, sadly, will never support all of these fun new tricks. You can see how we use CSS3 in our work for clients as well as in our own product, Notable. Found a super-awesome way to use these new properties? We’d love to hear about it in the comments!
References and Resources
(al)
© ZURB for Smashing Magazine, 2010. | Permalink | 101 comments | Add to del.icio.us | Digg this | Stumble on StumbleUpon! | Tweet it! | Submit to Reddit | Forum Smashing Magazine
Post tags: CSS, css3
-


Whether a designer, developer, blogger, or freelancer, you surely have a to-do list on which certain items slowly inch their way down. These forgotten items add up fast! Think of all the items that you’ve discarded from your to-do list to save time. Even more frightening, what items might you have overlooked to meet a deadline? What have you left on the proverbial cutting-room floor yet again?
What better time than the new year, or new decade for that matter, to tackle your neglected checklist? In this article, we’ll look at some commonly overlooked items on a typical checklist (in no particular order). Some are new, some are commonsense and some are not so minor and ought never to be forgotten. So, let’s get started in this young year by striking off some items from your to-do list!
Update The Copyright Date2009 2010
That’s right, it’s time to update the copyright year on your websites from <old date> – 2009 to <old date> – 2010. If you come across websites that show copyright dates as far back as 2003, the first word that pops to mind is “outdated.” Perhaps these websites have been kept up to date and only the copyright year has been neglected? Or perhaps the website really hasn’t been updated since 2003. Uh oh. This is not the first impression you want to give potential clients. After all, clients want to hire people who notice these things. What message does your footer send from below?

Here are just a few of the places you might need to change the copyright date:
- Website (all pages);
- Watermark (if you use the year);
- Footer (such as on your blog);
- Templates (blog, wireframing, frameworks, email templates, etc.);
- Readme files.
Résumé RefreshDouble-Check Everything
If you haven’t looked at your résumé (or curriculum vitae) in a while, now might be the time to do so. Even if you’ve been working steadily, you never know when you’ll need to submit your CV for that dream job that comes along.
This is a good time to make sure your listing of work experience is current. What new projects and clients have you taken on in the last year? Make sure your contact information is up to date, too. Has your area code changed? Have you switched cell phone numbers or moved? Double-check your zip code because some zip codes change occasionally.

Double-check every detail on your resume or CV. Employers frown on inaccurate contact info. Also, check the references that you’ve provided. Are the emails and contact info still valid? Would current employers be willing to act as references? Now is the time to make those changes so that you stay prepared in the market.
Double-check the following items on your résumé or CV:
- Home address,
- Zip code,
- Telephone number,
- Area code,
- Degrees earned,
- Certificates,
- Awards,
- Recent jobs,
- Recent projects,
- New contracts,
- Contact info for references.
Further Reading
Spell-CheckSpelling Kounts Counts
Sometimes you’re in such a rush that spell-checking is the last thing on your mind. Then again, most word-processing programs, email applications and website editors have automatic spell-checkers built right in. Most everyone relies on these programs to catch spelling mistakes. However, occasional slip-ups occur. You’ll often find “there” when “their” is correct, or “weather” when “whether” is intended.
Programs don’t pick up on such discrepancies. But people do. What kind of people? Potential clients and your peers. First impressions count, and poor spelling irks many people. You don’t want to irk someone because you left an “l” out of the word “professionally” on the front page of your website. (Guess who did that?)

A good way to manually spell check a website is to read the content in reverse and out loud to yourself. Start from the footer. Then spell check the actual website code. Don’t skip a sub-page that you think is irrelevant. Every little mistake you find is one less mistake that someone else will.
Further Reading
Spell-Check Your Website
Outstanding InvoicesGet Paid
If you haven’t already done so, look at your invoices. Have you not yet sent some invoices? You deserve to be paid for your services. You’re not being pushy, just professional. So, don’t put off sending an invoice.
If you’re lucky, your client will remind you to send one. But this is the exception, and you’d be wise to hold on dearly to such clients. Most clients won’t bend over backwards to pay you in a timely fashion. Take the initiative. Be assertive. Often the client simply forgot about the invoice once the project was completed and would be more than happy to pay in full right away.

What if you’ve already sent an invoice but haven’t been paid? Perhaps you forgot about an outstanding invoice from last year. No problem. Resend the invoice now. The client would most likely be happy to clear their books. Either way, you’ll hear an update on the situation.
Monitor Social NetworksPay Attention to What You Type
Social networking is all the rage, and you’ve jumped in head first. You’ve signed up with Facebook, MySpace and Twitter, to name a few. However, have you really examined your online presence? Take a moment to review your last 10 comments or posts on each social networking website that you are active on:
Do you see any comments that a potential client might find offensive? Clients aren’t likely to peruse your history of Twitter comments, but what if they did? The Delete key is your friend. However, deleting doesn’t erase the search engine cache of your updates. What seems funny and off-hand could turn clients away.

For instance, were you ever unhappy with a client and decided in the wee hours that 140 nasty profanity-laden characters were in store? Have you ever trash-talked a current or past client? Now, imagine a potential client reading that and how they would feel about working with you. Sure, being judged by your online comments isn’t always fair, but it happens.
Freedom of speech is great, but if your social networking accounts are linked to your business website, take heed. The comments you make on websites such as YouTube, Facebook and MySpace could come back to haunt your and your business’ reputation. Just as social networks are a great way to stay connected and to network, they are also an easy way to gather personal and professional information about you. Stay informed and be aware that even an off-hand Facebook Wall comment can have a big impact.
Avatars and Photos
Take a moment to review your avatar or Gravatar on social networking websites. Perhaps it’s time to update your photo to reflect your current hairstyle or image. If you want to project a professional image, a wacky avatar might not be the right choice. Then again, you would get noticed, in which case your comments would stand out even more to potential clients.
Social Profiles and Bios
Your bio on social networks might need updating, too. Check for any changes in your job title, interests or availability are reflected. Keep your profiles and bios current to reflect your business activity. That little extra detail makes you shine.
Don’t Forget to Talk to People
Don’t rely solely on Twitter and your blog. Monitor the original social networking tool: the telephone. Have you kept in contact with past clients? Now would be a good time to reach out and speak with them. Maintaining your social contacts is essential to keeping the door open to future projects.
Further Reading
Back Up Your WorkStop, Drop and Back Up Now!
Stop. Drop what you’re doing. Back up your work right now. Data loss can happen at any moment. Did you put 40 hours into a website last week and didn’t back up any of that hard work? Perhaps you have thousands of photographs stored on your computer? Those raw images, along with potential profits, are toast if anything goes wrong.
When was the last time you backed up your hard drive? Last week? Last month? Can’t remember? Uh oh. Time to back up now. Use a pen drive, CDs, DVDs, external hard drive or online storage website—just back up regularly. Your work changes daily: you send and receive email, add bookmarks, upload photographs and scan images. You have a lot to lose.

Backing up is only part of it. You also need to be able to restore your computer in the event of complete data loss. Look into bootable backups for peace of mind, and avoid devastation by backing up your work. Make it a top priority and not an afterthought.
Also, check your surge protector. Silly as it sounds, many people forget about their surge protectors. Like smoke detectors, this is a safety concern. The time of year when we turn our clocks back for daylight savings in the US also serves as a reminder to replace our smoke detector batteries. Perhaps the new year should be a reminder to check our surge protectors.
Have you checked your surge protector? Or better yet, do you own one? A surge protector protects your computer from voltage spikes in the electrical system. Not all power strips are surge protectors, so make sure yours will protect your electronics. Make sure the components are in good working order and functioning properly. If your drive is fried in a storm, what good is the data backed up on the external drive?
Further Reading
Update Your Portfolio
You probably have a portfolio of your work online. But is it up to date? Have you added current projects to the queue? The new year is a great time to add recent samples of your work to your portfolio. If you haven’t done any recent work or can’t show certain projects because of a non-disclosure agreement, then just showcase some of your personal projects to show off your current skills. Your online presence is defined partly by the work you present.
Visit your portfolio in the mindset of a prospective client. Are your images large, high quality and clear? Do the images reflect your current set of skills? Would you hire yourself based on what you see? If you haven’t done so already, check the spelling of project titles, client names and companies.

Be honest: are you one of those people who go a little overboard with their portfolio? Do clients have to click through 15 pages to see the scope of your work? Do visitors have to wait for 100 images to load to view your graphic design portfolio? Now might be the time to trim your portfolio. Sometimes having a few high-quality examples is better than having many of inferior quality. Let the portfolio shine without the clutter.
Further Reading
Test Your Contact FormCan Visitors Reach You Online?
When was the last time you checked the contact form on your website? Once the contact form is implemented, it is often neglected. Perhaps you have been losing potential clients because they have been unable to get in touch with you. Take action now by double-checking how visitors can reach you online.

First of all, is it easy to find your contact form? Could a visitor find the contact form from the “About us,” “Services” and even “Contact us” pages. Surprisingly, many people forget to include a working link or contact form on their own contact page. Try sending yourself a message. Did it work? If not, the problem could be the email address, the code, the CAPTCHA code or the “Send” button itself.
Further Reading
Catch Up On EmailOpen, Read and Reply. Repeat.
Don’t let those unread emails pile up again this year. Attack your emails in a timely fashion, and develop a habit that pay dividends over the course of the year. Clients will see that you’re on top of things and that projects are running more smoothly, and you’ll be happier knowing you don’t have over 60 emails waiting to be addressed. Procrastinating doesn’t help. Open, read and reply to your emails.
Update Your Signature
This is also the perfect time to update your email signature. Check the address, phone number and links listed in your signature. Are they current? Make sure the links are active, working and relevant. Perhaps freshen up your signature with a new quote or proverb.

Check the Spam Filter and Junk Mail Folder
As time passes, we can easily forget to check the settings in our email program. See whether the reason you’ve been receiving a ton of spam is because your spam filter has been turned off. Also, sometimes email is dumped into the junk mail folder by accident. Check to see if any important emails have ended up there.
Clean-Up TimeWhat Dirty Little Secrets Is Your Keyboard Hiding?
Like to drink coffee? You could very well have spilled some on your keyboard, and because it was miniscule, you just forgot about it after a quick swipe with a cloth. A drop or two doesn’t hurt, right? What about that morning bagel? Or those pesky granola crumbs? Yes, you may not see the mess, but the grunge is there, hiding in the nooks of your keyboard. Sure, a few crumbs won’t hurt, but the build-up will. But a silicone cover catches everything, you say? Wrong. Lift the cover off the keyboard and witness the fluff that has crawled in there.
How long ago did you clean your keyboard? That’s the question. It’s never too soon to clean it. If it’s sticky, it’s been way too long. Not only can grime build up, but so can germs. Bacteria. Cross-contamination can occur. Just a few minutes cleaning those keys could prevent a common cold or worse. While you’re at it, you might want to give that mouse a good cleaning, too.

What’s Cluttering Your Desktop?
Do you have too many files on your desktop? This visual clutter might be distracting you, causing you frustration and, in the long run, costing you time and money. The time it takes to find a file on your hard drive or your desk is time taken away from a project.
Here are a few ideas to de-clutter your virtual and real spaces:
- Organize your desktop files;
- Put away the files on your actual desk (no loose papers);
- Change your desktop wallpaper;
- Remove accessories from your desk (keep it minimal);
- Hide or bundle electrical cords;
- Add keywords to files and photos;
- Label files and folders;
- Fix those broken items to make them usable (or throw them out).
Accomplishing just a few of these things will make your workspace more inviting and save you time later on.
Further Reading
SaveBe Safe: Save
Finally, learn to save as you go. Whether writing, blogging, coding or designing, saving as you go is always safer. You never think of it until it’s too late. You don’t want to find yourself scouring forums looking for a thread titled “Is there any way to recover six hours spent on my Adobe Photoshop file.”

The answer is to save as you go. Make saving a habit. Learn the “Save” shortcut for the programs you use. In Adobe Illustrator, Command + S saves a file. Do this after every layer, paragraph and so on and you’ll save yourself time and heartache.
Resolutions
Have you got new year’s resolutions? Perhaps you want to start keeping your desk uncluttered or backing up your work every other day. Now is the time to integrate these tasks into your routine. By doing so, you’ll cultivate good habits over the year. Start slowly, one little goal at a time. Tackling too many resolutions will overwhelm you. Accomplishing one little resolution over the course of the year is wiser. As they say, the little things add up!
In Conclusion
There you go. We surely could have added more things to this list. Did an item here jog your memory? What little things do you put on the back-burner and then forget about? Feel free to share some of your to-do’s to help the rest of us out. This way, by next year, everyone’s list will be a lot shorter!
Further Reading
(al)
© Melissa Scroggins for Smashing Magazine, 2010. | Permalink | 59 comments | Add to del.icio.us | Digg this | Stumble on StumbleUpon! | Tweet it! | Submit to Reddit | Forum Smashing Magazine
Post tags: freelancing, productivity, work
-
This week we took at look at how to tie your shoes more efficiently, put your computer to good use while you're asleep, and polished our sushi etiquette.
Photo remixed from Remko van Dokkum and Ian Wilson.
- Ditch the Granny Knot to Tie Your Shoes More Efficiently
The difference between shoes tied with a balanced, neat, and self-tightening knot versus those tied with an unbalanced, sloppy, and loose knot, is all in how you make your first loop.
- Build a Wall-Mounted Kitchen Computer
If you've been dreaming of having a computer in your kitchen but don't like the idea of hanging it from a cabinet or having it clutter up the counter, this guide can help you build a sleek in-wall computer.
- How to Put Your PC to Good Use While You're Sleeping
If you've been dreaming of having a computer in your kitchen but don't like the idea of hanging it from a cabinet or having it clutter up the counter, this guide can help you build a sleek in-wall computer.
- Five Best Photo-Printing Sites
Digital cameras are fantastic for letting us experiment, take tons of photos, and search for the perfect shot. Digital picture frames and at-home prints are often poor substitutes for real photos.
- Lift Weights 10 Minutes a Day, 3 Days a Week to Lose Belly Fat
Even if you don't care about having six-pack abs, studies show excess belly fat is unhealthy. Turns out just 30 minutes of weight lifting a week can make a big difference.
- Google Wave Versus the Rest, Feature by Feature
We got a great response to last week's frequently asked questions about Google Wave, and decided it's worth expanding further on the differences between Wave and the current crop of web-based collaboration offerings.
- Top 10 Clever Kitchen Repurposing Tricks
It's all too easy to spend hard-earned money on unitasking kitchen gadgets that aren't all that helpful in the long run. Use the gear you already own, and some cheap household staples, to make your kitchen a better place.
- Create a Minimalist "Undesktop" for Distraction-Free Productivity
If you really want to get down to business and get things done, you need to create an environment conducive to productivity. I do it by eliminating everything that might distract me from accomplishing what I want.
- Learn Proper Sushi Etiquette to Make a Good Impression
Like many aspects of Japanese culture, there's a certain etiquette to eating sushi. Take the time to peruse these helpful tips so you can make the best impression on your sushi chef or dining companions the next time you're downing some maki.
- Build a Lego Router
We love the Linksys WRT54GL router for its extreme hackability (it's what we used to turn our $60 router into a $600 router with DD-WRT or with Tomato), so we couldn't help but appreciate this fun WRT54GL Lego mod.
-


Despite any financial recession and economic stress, online purchasing continues to grow. Expansion of the market and evolving technology that simplifies our daily lives help to set the pace of e-commerce design. Customers want the shopping process to be quick and easy, and merchants want to increase sales by making their stores attractive and popular. Thus, e-commerce design tends to combine a look and usability that is at once unique and eye-catching. In this post, we showcase 35 attractive online store designs.
One of the trends we observed from this collection is a minimalist design style. Small details and accents (e.g. unobtrusive background patterns, icons, pictograms and typography) reflect a brand’s spirit and match the character of its products. Some websites, though, are unconventional, rich in visual effects. Please note that the selection of stores featured in this showcase was based more on design aesthetics than usability. But we made sure that the websites included here provide at least an easy shopping experience, even for foreign visitors.
Showcase of Beautiful Online Store Designs
Blik
Blik manufactures whimsical removable graphics to spice up the walls of your home. Even though the “About” info gets a bit lost in the large product preview in the center, getting an idea of what Blik is all about doesn’t take longer than a couple of seconds. Aside from the stylish look, the easy shopping experience is what makes this design exquisite: all products are categorized by tags, the thumbnails are big, product descriptions are detailed and supported by decal outlines, and quick tips are placed here and there for maximum assurance. Vintage-looking faded colors and rotating logo add considerably to the elegance.

Fred Perry
Fred Perry’s e-commerce store has a contemporary and elegant look, conveying key features of the brand very well. The stylish grayscale color scheme, along with sparse text in Helvetica font, make an impact. The design naturally combines Flash and JavaScript. The mini-cart window, the readable layout of the shopping cart and checkout pages, the usable navigation and informative product descriptions all up to a slick and friendly shopping experience.

Nectar
The website for clothing and accessories boutique Nectar was designed by Sunrise Design studio. The website’s structure allows you to browse goods and make purchases with ease. A muted palette and slipshod watercolor strokes in the background give the layout a positive feel. By the way, if you visit the designers’ portfolio page, you’ll see that painted styles must be their passion.

Tommy Hilfiger
Another giant brand: Tommy Hilfiger. This design relies on simplicity, a comfortable shopping experience and its corporate identity.

Seibei
Now, that’s a design you will not forget! The site has a very simple, even minimal navigation combined with a striking “cartoonish” design. Product pages are clean and straightforward. Nice and unique design solution.

Bellyshades
The design of German club-wear and accessories store Bellyshades stands out for sure. The vibrant acid colors, insane typography and animals that stand in for shopping carts will leave you anything but cold.

Ten Little Monkeys
This design has a very strong visual appeal; vibrant colors work well on the dark background, the navigation is colorful yet intuitive (notice how the section for girls and boys are distinguished). Also, the choice of typography is appropriate for the shop’s main objective: selling branded children’s fashion and gifts.

DogCollars.ca
Here’s another beautiful e-commerce website: DogCollars.ca. It’s a simple HTML website with a neat grid-based layout, a warm chocolate color and big high-quality thumbnails. The design is minimalist but not plain, and it delivers a satisfying shopping experience.

’47
Premium sports apparel brand ’47 has an interesting history: “This is a classic story. It’s the American dream come to life…” Thus, the company emphasizes the individuality of its brand in its store design and associates that brand with a community. The website combines jQuery and Flash, which slows the loading speed, but given its objective, this is not critical. Creative visualization and a well-implemented shopping mechanism make for a wonderful e-commerce design.

Storyville Coffee Company
Creating an e-commerce Flash platform, let alone a good one, is challenging. In addition to the Converse store profiled above, our showcase includes another fully Flash-based online store: Storyville Coffee Company. This one sports a pleasant coffee theme (appropriately enough), an original table-like product viewing area and an easy shopping process.

Narwhal Co.
Accessories made from recycled ties? Yes! Narwhal Co. produces original jazzy merchandise from recycled ties, including wallets, wrist wear, covers and cases. The tie theme in the website’s header and footer, the stylish icons and the inventive product slideshow on the main page give this design a special flavor.

The Famous 4th Street Cookie
Beautiful typography and high-quality images make this a tasty design.

Via Snella
The website of Swedish male fashion brand Via Snella is clean both in design and usability. The store itself is not very big, so the product gallery is not cluttered with the superfluous navigation bars, announcements and slideshows that are typical of large comprehensive online stores. Instead, the background of the fancy product thumbnail grid is made up of a classic black and white scheme, along with austere typography and plenty of white space.

Twelve South
Twelve South creates accessories exclusively for Apple computers. No wonder Apple’s style can be felt both visually and in the functionality, which is a compliment enough to Twelve South’s store design.

Godiva
High-quality food photography against a light minimalist background is quite effective for Godiva Chocolatier’s store design. Seeing those yummies on the main page is all it takes to hook you. Tons of products are available here, but the sophisticated navigation system and clean layout make shopping a comfortable experience. The shopping cart and checkout pages adhere to principal usability standards.

Marc Hansen’s Comic Book
An original, striking and beautiful design that perfectly sets the atmosphere and communicate the style of the designer and his main product – a comic book.

Vanilla Vanity
Now, that’s a weird web design. The products offered in the shop are just as weird, by the way. An original, unique design which deserves a spot in this showcase.

Atom Bicycles
A very simple, clean and stylish design with unusual navigation and good-looking product pages.

Converse
One would expect a great design from top-class brand Converse. Our expectations are met. Despite being entirely Flash-based, Converse’s online store is quick to load and easy to navigate. We see no heavy graphics or fancy Flash transitions here. Converse’s brand is communicated well by means of simple effects, including concrete and jeans textures, hand-drawn product selection frames and grungy graphics. The buying process is similar to the famous sneakers themselves: comfortable and painless.

Steve & Co.
Aside from its refined and clean appearance, the website for leather accessories store Steve & Co. is remarkably usable. For instance, the whole shopping process requires little jumping around: you can browse and preview products, add them to the cart and review purchases without reloading the page.

iWorkwear.nl
This design has plenty of white space, making the black and yellow scheme especially appealing. There is no visual appeal, but the site works very nicely and it is very user-friendly. Even if you don’t speak Dutch, getting your bearings on iWorkwear.nl is easy because of the intuitive placement and highlighting of elements. A transparent table of brands sold in the right sidebar helps us easily find clothing without having to use the main navigation panel, which is in Dutch.

Sony Style USA
Sony Style USA is a pearl in our collection. It would be hard to find a more comprehensive, sophisticated and seamlessly designed e-commerce website. If you are looking to buy a laptop, you can read exhaustive product overviews, compare and browse reviews of similar products and even configure the computer you’ve selected, all without leaving the website. Even with the variety of products, the store is well organized and easy to navigate. The dark and light colors, along with the Flash and jQuery, perfectly fit this online store.

Abel & Cole
The spirit of a small, environmentally friendly neighborhood grocery store is well reflected in this design by means of charming sketches and hand-drawn typography.

Hollister Co.
Hollister Co. sells Southern California-inspired casual wear. The store has a cool vintage style. Products are displayed horizontally; hover over an item to see its price and available colors without leaving the page. How usable! Warm sand colors and sepia-toned beach photos reflect the “SoCal” spirit of the brand. And we sure like those “Dudes” and “Bettys” categories!

Gargyle
Gargyle online warehouse website is simple yet cute. Blue dotted lines and lovely icons wonderfully reflect the old country-club lifestyle that Gargyle that aspires to.

Giraffe
A colorful design for young families and children. The design perfectly sets the atmosphere for the shopping experience. Notice how well PayPal-payment is communicated.

farfetch.com
Well-known fashion boutique farfetch.com has an elegant black-and-white design. Nothing gets in the way of a pleasing shopping experience here. The auto-detection of your location and currency are stylish features.

Winestore
Everything here is about elegance, style and creativity. Vibrant pink against a white background makes for a vivid yet clean website. Beautiful typography and the “bar code” header complement the company’s image well. Pictograms with information about the wines’ color, body and flavor are a smart addition.

Ork Posters!
This one will interest all those who love typography, print design and data visualization. Ork Posters is the brainchild of Jenny Beorkrem, whose original typographic neighborhood posters quickly became a success. The online store is nothing short of a manifesto of typography love.

laPatate
Belgian t-shirt store laPatate has a creative and funny design (the men’s tee samples enjoy the lion’s share of laughs). The website is available in French only, but clear cart icons and a standard check-out page make for an intuitive shopping environment.

Snupped
Snupped is a nice dark-themed store that sells laptop sleeves. You can buy pre-made sleeves or build your own design, configuring the size and choosing from a number of funky patterns. The products are not tagged or grouped into categories, but this is hardly an oversight given the store’s small size.

Cellarthief
Cellarthief is a beautiful online wine store that sells only three wines at a time. The Apple.com-inspired content blocks against the real-looking wood background shows how the classic spirit of the wine industry is fused with modern design values.

Harry Winston
A lot of glamour, shine and luxury is in this one. Harry Winston’s jewelry store features an amazing design with images that mix typography and jewelry.

Olive & Myrtle
Olive & Myrtle produces beautiful sustainably developed goodies. A clear layout, soft natural colors and subtle typography make this website look modern and eco-friendly.

Hokey Croquis

CuCuu
CuCuu is a charming little store that sells bags and accessories made from recycled materials. The design is minimalist and the shopping experience simple.

Teez
Rules and standards are made to be broken from time to time. You don’t have to speak Russian to tell that the design of Ukrainian t-shirt store Teez is far from ordinary. A chaotic mash of text and images is obviously a new trend in Web design. Despite all of this, the shop looks and feels pretty darn awesome. Take a minute to explore the website and you’ll see how easy it is to shop there. Off-the-chart creativity!

Kinki Micks
This small store sells exclusive car wheels and vintage riding accessories. The design has a simple retro style that perfectly fits the company’s profile.

Red Is White
Red Is White’s design is bright, and the shopping process is pretty solid (the power of inspirational Web design in practice!). A carefully arranged grid, unobtrusive colors and a smooth corduroy-looking texture make the website visually eye-catching, yet they do not eclipse the products. The way the t-shirt thumbnails are displayed is quite handy: just roll over an image of a print to see how it looks on a model.

Related posts
You may be interested in the following related posts:
(al)
© Julia May for Smashing Magazine, 2010. | Permalink | 61 comments | Add to del.icio.us | Digg this | Stumble on StumbleUpon! | Tweet it! | Submit to Reddit | Forum Smashing Magazine
Post tags: showcases
-


As Web developers and designers, we are spoilt for choice right now. To build a complex Web application or even just spice up a website with some highly interactive interface element, we have hundreds of pre-built solutions to choose from. Every library comes with widgets and solutions, and every developer tries to make a name for him or herself by releasing a funky JavaScript solution to a certain interface problem. We can pick from dozens of menus, image carousels, tabs, form validators and “lightboxes.”
Having this much choice makes it easy for us to pick and choose, which is where things go wrong. In most cases, we measure the quality of a solution by its convenience to us. Our main reasons for picking one solution over another are:
- Does it do what I need it to do?
- Does it look cool?
- Does it sound easy to use?
- Would I want to use it?
- Does it use the framework I’m committed to?
The things you should really look for are different, though:
- How stable is the solution?
Is a good alternative available if this one doesn’t work? - How easy is it to customize?
Do you need to be a JavaScript expert to modify the widget? - How usable and accessible is it?
Are users who don’t have a mouse or are on a mobile browser blocked? - Do you understand what’s going on?
Would you be able to fix a problem and explain it to others? - Is it a contained solution?
Will other scripts be able to interfere with it, or would it contaminate the document? - How dedicated is the developer?
Will the solution be maintained in the future? - What is supported, and how can you extend functionality?
A new browser and client request is always around the corner?
In this article, we’ll show some ways to find out more about these issues. First of all, though, understanding what it means to develop for the Web is important.
It’s Not About You
Most of the reasons why we choose a particular solution right away are very much about us, and this is where we tread on thin ice. We don’t consume what we put on the Web; rather, people we don’t know do, and we can’t make assumptions about their ability, set-up, technical understanding or taste. We won’t make our product a success; we only build it, and thus we are the worst testers of it possible.
I’ve been developing for the Web professionally for over 10 years now, working on everything from personal blogs to multi-language enterprise CMS solutions to complex Web applications, and I’ve learnt one thing on the journey: never build for yourself or the client. Instead, build for the people who will use the product and the poor person who has to take over the project when you leave.
Much as we have to act now to minimize our massive carbon footprint, we need to leave a cleaner Web behind. To keep the Web a thriving market and sustainable work environment, we have to change the way we work in it and leave behind unmaintainable, bloated and semi-workable, albeit pretty, solutions. We have to make it easier for people to use Web applications and save other developers from wasting hours trying to understand what we did when they are asked to change or extend it at a later stage.
Introducing The 7-Step Test For JavaScript Widgets
To this end, I’ve put together a seven-step test to apply to any out-of-the-box widget you find. All of the recommendations have a rationale, so please ponder it before dismissing the arguments as “elitist” or “not really suitable to our environment.”
Let’s not forget that even when something is free, its developer will try to sell it to you for the fame, and many a solution is defended tooth and nail on mailing lists instead of being changed or updated. The reason is that, as developers we are always on the move. Maintaining and extending an old solution is not as sexy as creating a cool new one. This leads to ruins that once enjoyed love when they were state of the art but now rust away on the Internet.
To kick the tires of any out-of-the box solution, I mostly use one tool: the Firefox Web developer toolbar. It is available on the Firefox Add-On website and gives you an easy way to test what’s happening in your widget of choice.
Okay, here goes: seven things to test when deciding on a JavaScript solution.
1. What Happens If JavaScript Is Turned Off?
The first test I do with any widget is turn off JavaScript… not after the document has loaded but before. Turning off JavaScript with the Web developer toolbar is very easy. Simply select “Disable All JavaScript” from the “Disable” menu and reload the page:

The rationale is that there are a lot of reasons why JavaScript may not be used: company proxies or personal firewalls could filter it out, other scripts could create errors and mess with yours, or the system in use could simply not have JavaScript enabled. Think of mobile environments, for example.
You don’t need full functionality when JavaScript is not available, just a working interface that doesn’t overload users and interactive elements that work. If a button does nothing when users activate it, those users will stop trusting you; after all, you haven’t kept your promises.
Overloading is another issue. A lot of widgets use CSS and JavaScript to squeeze a lot of content into a very small space: think tabbed content elements and image carousels. What should be their fallback? If you turn off JavaScript and have 50 pictures where you planned for 2, then that would be a good user experience. A better fallback would be a server-side solution for the same functionality or to show the first 2 and then offer a link to a gallery page with the remaining pictures.
Sometimes the JavaScript for a particular widget is actually very good but the demo websites have been done badly. Hiding elements with CSS and then revealing them with JavaScript, for example, is very common. But if JavaScript is turned off, the solution will break. Good demos and solutions use JavaScript to add a class to the body of the document and make all of the CSS dependent on that class.
The trick that any good JavaScript widget should do is to make any functionality depend on JavaScript by using JavaScript; that way, you never have any functionality that won’t work. This technique is called “unobtrusive JavaScript,” and I have written a course on it and set a few rules for it a while back.
2. How To Change The Look, Feel And Content?
A widget whose look and feel are hard-coded is a pain to maintain. You cannot expect future designers to know how to change a certain color by hunting through your JavaScript files. This is how we end up with bloated CSS files, because people add random IDs and classes to enhance the specificity of their CSS selectors.
Good widgets have their look and feel contained in a CSS file and give you handles (i.e. dynamically applied classes) to apply your own styling. If you find yourself having to change JavaScript to change the look and feel, alarm bells should go off in your head.
This gets worse if you have content such as text labels in the JavaScript or if only a fixed number of elements can be displayed (as in the case of navigation menus). Labels and number of elements are what change the most in any Web product. For starters, you will probably roll out your product across different markets and will have to translate the buttons and menus.
Good gadgets have configuration objects that allow you to change the number of elements and define the text labels without having to change the main JavaScript. The reason for this is that the functional part of the widget should be separated from the maintainer. If the widget has a security or performance problem, you should be able to replace it without losing your configuration and localization work. Otherwise people would be very likely to keep insecure code on the Web, which is one of the reasons why our inboxes are full of spam.
3. How Usable And Semantic Is The Final Product?
A lot of widget creators are very happy to announce that their products are “Web-standards compliant” and accessible because of it. While Web-standards compliance is important, it does not indicate the quality or usefulness of the product. One cannot really validate semantics with an automated tool. For example, the following examples are both valid HTML:
<div class="menu">
<div class="section">
<span class="label">Animals</span>
<div class="subsection">
<div class="item">Giraffe</div>
<div class="item">Donkey</div>
<div class="item">Cheetah</div>
<div class="item">Hippo</div>
</div>
</div>
<div class="section">
<span class="label">Stones</span>
<div class="subsection">
<div class="item">Diamond</div>
<div class="item">Ruby</div>
<div class="item">Onyx</div>
</div>
</div>
</div>
<ul class="menu">
<li><button>Animals</button>
<ul>
<li><a href="giraffe.html">Giraffe</a></li>
<li><a href="donkey.html">Donkey</a></li>
<li><a href="cheetah.html">Cheetah</a></li>
<li><a href="hippo.html">Hippo</a></li>
</ul>
</li>
<li><button>Stones</button>
<ul>
<li><a href="diamond.html">Diamond</a></li>
<li><a href="ruby.html">Ruby</a></li>
<li><a href="onyx.html">Onyx</a></li>
</ul>
</li>
</ul>
The second example works without JavaScript and uses much less HTML. It also requires much less CSS for styling because you would simply take advantage of the cascade.
Furthermore, the HTML on which the widget is based is only half the story. What the JavaScript generates also needs to be valid, usable and accessible, and you can check this when you check the generated source in the Web developer toolbar.
To do this, right-click anywhere in the document and select Web Developer → View Source → View Generated Source:

Usability and accessibility (accessibility being, in essence, merely a more comprehensive understanding of usability) are harder to test. But one very good test is to check how keyboard-accessible a widget it. Keyboard-only users are on the rise, and widgets that work only with mouse-over events would not usable on a touchscreen mobile, for instance. Many widgets provide basic keyboard access (e.g. using the Tab key to jump from one link to another, and the Enter key to activate each), but this is not proper accessibility.
A menu, for example, should not be navigated by tabbing through each of the items because this would require far too many keystrokes. Instead, the user should be able to tab to the main menu bar and from there use the cursor keys to navigate.
A modal pop-up (commonly called a lightbox) should be able to be closed with a keyboard by hitting the Escape key or by tabbing to the “Close” button. If it is a multi-item lightbox, you should also be able to navigate the items with the cursor keys.
The W3C’s WAI websites have some great examples of how widgets should react to keyboard use, and Todd Kloots of Yahoo does a great job of explaining the techniques behind good keyboard usability (also as a video and using YUI3 and focusing on WAI-ARIA). Patrick Lauke of Opera also wrote a great article on the subject and gave a presentation at last year’s Future of Web Design. If you are a Mac user, make sure to turn on keyboard access before declaring a widget faulty.
People also need to be able to resize the text in their browser. So test the widgets at several text sizes. Using Internet Explorer 6 for this is important because it is the main culprit in font-resizing issues. Newer browsers do a much better job of zooming the entire interface, but you cannot expect end users to know how to use them.
4. Do You Understand What’s Going On?
If you’ve read the Harry Potter books (or even seen the movies), you know that you shouldn’t trust magic without knowing what is going on. A book that responds to your writing is as suspicious as a widget that does something so amazing that you have no clue how it happened.
Remember, if the doo-dad stops working, you will be asked to fix it or explain what went wrong. Therefore, it is important to at least know the basics of what JavaScript spell was cast to transform a list of images into an all-singing, all-dancing carousel.
Good widgets have technical documentation for that kind of thing, and some even fire off custom events that tell you when something is happening. That way, you can debug the tool by waiting for these events and analyzing the current state of play. It also allows you to extend functionality, which we’ll come back to in step #7.
5. Does It Play Well With Others?
The biggest problem with any JavaScript on the Web right now is that its security model gives every script on the page the same rights. This means that one bad script can mess up the user’s whole experience because it may override parts of another script.
The places where scripts can clash are in variable and function names and events. If your widget does not protect its variables and function names or if it applies event functionality to elements without checking that other scripts are doing the same, you’ll have a problem.
Say you have an element with the ID menu, and you have one script that turns its HTML content into a drop-down menu and another that enhances the different links by showing a beautiful roll-over message. If neither of these scripts append to the existing functionality and just apply it, you’ll have either a beautiful roll-over or a menu, depending on which script is applied last.
The good news is that for widgets that are based on libraries, this “event clash” is very unlikely because libraries work around that out of the box. You can test for the problem of function and variable names that can be overwritten by other scripts. JSLint is a tool and website where you can check JavaScript for syntactical problems such as unprotected variables. It is a very strict tool, though, and not all of its warnings are actually deal-breakers. But testing with JSLint is the hallmark of a professional Web developer. You do want your code to play well with others.
6. How Dedicated Is The Maintainer?
When choosing a widget, you want to be very sure that the maintainer is dedicated to keeping it up to date and to fixing the script for future browsers and environments. This is rarely the case, and a lot of software is released with an “as is” statement, absolving the creator of any liability for problems it may cause now or in the future.
Software, especially the kind that is executed in the browser and for Web consumption, has to constantly evolve. Things that were once state of the art might be clumsy now. Some software turned out to perform poorly or be outright security holes.
Whenever people claim that we have a great baseline environment on the Web for screen space and processing power, something comes along that debunks it. Right now, testing on dual or quad-core processors with resolutions starting at 1280 might be normal for us designers, but given the sales figures of smartphones and netbooks, planning for audiences other than these high-end ones might be a good idea.
For developers, maintenance is the most boring task. When we release awesome widgets to the world, we don’t want to think about that phase of software delivery. Granted, most widgets are released as open source, but sadly, not many developers fix or improve on other people’s work; building and releasing something almost identical but slightly modified is much more fun.
As the user of someone else’s widget, you don’t want this to fly back in your face, so you need to see just how dedicated the developer is. A few questions to ask are:
- Is there a simple way to report bugs?
- Is there trail of improvements and bug fixes?
- Is there a history of comments and changes to the widget based on that feedback?
- Has the widget been used in real scenarios, large projects or implementations similar to yours? What were the experiences of those who used it?
- Does the solution have a community (i.e. are there a few people on mailing lists or in forums helping each other out, rather than overloading the original developer)?
If the developer has no big personal stake in the widget or there is no group of developers or commercial users, then there is a high chance that you will see few or no fixes or improvements in future, and you will be responsible for supporting the next browser version that behaves badly.
7. Is There A Testing Plan, And Is Upgrading And Extending Easy?
One last thing to consider is what will happen in future. Claims that the widget will “work in every environment” are bogus because that cannot be done. The great power of the Web is that software solutions can adapt to the environment they are being used in. If you use Netscape 4, you should see a few images; if you use the newest Webkit browser, you should see a fancy image carousel with animation and fading; that sort of thing.
A good widget will have a proven test report covering which browsers and environments it has been tested in and what the known issues are. There will always be issues, and claiming otherwise is arrogant or ignorant.
Upgrading your widget should be easy and painless, and there should be some versioning in place, with new versions being backwards-compatible.
Extending the widget should be easy. We spoke earlier about not being limited to a particular number of items or a certain look and feel. But if you really use a widget, you will find you have to override certain functionality and react to various changes. Good widgets either have an API (a programming interface to extend it) or fire custom events for you to listen to. Custom events are “interesting moments” in a user’s interaction with the widget. For example, a button will tell the script when you have activated it, and if you write the widget a certain way, you can tell the world (or in this case, other scripts) when something happens to it. You can notify that a container has been opened, that data has returned from the Web or that a menu was too large to be displayed to the right and had to be moved to the left.
Widgets built with the Yahoo User Interface library, for example, come with a lot of custom events:

This allows you to monitor what is going on (like for debugging purposes) and extend functionality. The demo page for the AutoComplete control, for example, displays in a logging console on the right what happens “under the hood” when you use the auto-complete field.

By subscribing to these events in JavaScript, overriding the original functionality for something new is pretty easy; in this case, we have an auto-complete that returns photos and allows you to collect them.

Custom events are a great way to extend a widget while keeping the core code easy to upgrade.
One Final Word On Size
One last thing to mention: some widget developers use a certain argument to advocate for their solution but which is totally irrelevant to your decision, and that is size.
Advertising-speak like “A drop-down menu in 20 lines of JavaScript” or “A full featured lightbox in under 2 KB” is fun and good for the developer’s ego, but in reality it is no measure of the quality of the solution. While you should avoid JavaScript solutions that are massive (let’s say 100 KB), code that has been written to be very generic and easy to extend will always be bigger than code that has been written to serve a single purpose. Any widget whose size is proudly trumpeted and is meant to be used by people who are not as good at developing as the initial owner will get bigger over time anyway. Developers like to play the numbers game, but maintainable code is different than extreme number-crunching.
And if you get your kicks from this sort of thing, try the demo scene in which Farbrausch proved with The Product in 2000 that you can fit a seven-minute animation with music and synthesized voices into 64 KB.
(al)
© Christian Heilmann for Smashing Magazine, 2010. | Permalink | 24 comments | Add to del.icio.us | Digg this | Stumble on StumbleUpon! | Tweet it! | Submit to Reddit | Forum Smashing Magazine
Post tags: javascript
-


We all have shortcuts that are essential to our daily workflow. A majority of them are staples such as Copy (Command + C) and Paste (Command + V), but occasionally we stumble upon a shortcut we wish we’d learned years ago. Suddenly, this simple shortcut has streamlined our process and shaved quite a bit of time off our day. Collected here are some lesser known but extremely useful shortcuts. Many of these are not documented in the “Keyboard Shortcuts” menu, and some of them don’t even have equivalent menu options.
Please note that all of the shortcuts listed below assume that you are using Photoshop CS4 on OS X. They will work on the Windows platform by converting as follows: Command → Control and Option → Alt.

LayersSelection
Sifting through nests of layer sets to find the layer you need quickly becomes tiresome. Luckily, there are a number of ways to select layers more intuitively. Using the Move tool (V), you can Command + click on the canvas to select the uppermost layer with pixel data located directly below the mouse. If your layers are grouped within layer sets, this action may have selected the entire folder. You can change this behavior to select the actual layer by using the Auto-select drop-down in the Move tool’s property bar.

Changing auto-select behavior.
There will be times when you want to select a layer that is located below a number of other layers. By right-clicking with the Move tool, you’ll bring up a contextual menu containing a list of all layers located below the cursor. If your layers are properly named, you should be able to quickly select the layer you need. By holding Shift while using either of the selection methods above, you can select multiple layers. After selecting multiple layers, you can link the layers together by right-clicking and selecting Link Layers.

Right-clicking to display all layers beneath the cursor.
The keyboard can also be used to select layers. Pressing Option + [ or Option + ] selects the layer below or above the current layer, respectively. Pressing Option + < selects the bottommost layer, and Option + > selects the uppermost. Option + Shift + < selects all layers between the current layer and the bottommost layer, and Option + Shift + > selects all layers between the current and uppermost.

Sorting
Sorting layers with the mouse can be clumsy and slow. A few shortcuts speeds up the organizing. Command + [ and Command + ] moves the selected layer up or down one position in the stack. If multiple layers are selected, they’ll move relative to the uppermost or bottommost layer. Pressing Command + Shift + [ or Command + Shift + ] brings the selected layer to the top or bottom of its current layer group. If the layer is already at the top or bottom of the layer group, it jumps to the top or bottom of the parent layer group.

Viewing
Option + clicking the eye icon of a layer is a commonly known way to hide or show all other layers. There is also a way to expand and collapse layer groups: by Command + clicking the arrow next to the layer group, you can close or expand all other layer groups; this does not work on nested layer groups. Alternatively, right-clicking the arrow gives you a menu to perform the same actions; but this will work on nested layer groups.
Duplicating
There are a number of ways to duplicate data from one layer to another. Duplicating an entire layer is as simple as pressing Command + J. If a selection is active, you can use the same shortcut (Command + J) to create a new layer based on the selected area of the original layer. Pressing Command + Shift + J with a selection creates a new layer while cutting the data from the original layer. Holding Option while pressing one of the arrow keys allows you to duplicate the current layer and nudge it by 1 pixel. Holding Shift and Option nudges the new layer by 10 pixels.

Duplicating data from multiple layers can also be done more quickly using some keyboard commands. Using Command + Shift + C with an active selection copies the data contained within it to the clipboard. You can then paste it to a new layer (Command + Option + Shift + N, Command + V). If you’d like to create a flattened copy of the entire document, use the shortcut Command + Option + Shift + E: a composite of all visible layers will be added as a new layer to the top of your layer stack.

BrushesShape and Size
Being able to quickly adjust the brush tool is crucial to getting a swift workflow. Many know about using [ and ] to decrease and increase the brush’s diameter, as well as Shift + [ and Shift + ] to decrease and increase the brush’s hardness. However, CS4 introduced an even more intuitive way to do this. By holding Control + Option and dragging on the canvas, you can change the brush’s diameter with a visual aid. Control + Command + Option and dragging gives you control of the brush’s hardness.

The on-canvas drag makes brush adjustments more intuitive.
If you would like to completely change the brush shape to a different preset, press < or > to cycle through them and Shift + < or Shift + > to select the first or last brush. Right-clicking inside the canvas also displays a condensed menu of brushes.

Opacity, Flow and Mode
The opacity of the brush tool can be quickly tweaked using the number keys: 3 = 30%; 3 + 5 = 35%; 0 + 3 = 3%; 0 = 100%. Holding Shift when inputting the numbers sets the flow of the tool. Note that if Airbrush mode is on, these two shortcuts swap (i.e. holding Shift controls opacity instead of flow). You can toggle Airbrush mode on and off using Option + Shift + P. The same numeric input method can be used to determine the opacity of a layer when the Move tool (V) is active; pressing Shift allows you to alter the Fill of the layer.

Quick Fill
Instead of selecting the Fill tool (G), you can quickly bring up the Fill menu using Shift + F5. Even better, bypass the menu entirely using Option + Backspace to fill with the foreground color or Command + Backspace to fill with the background color. These keyboard commands can also be used to quickly set the color of a type or shape layer. To preserve transparency when filling, you could first lock the transparency of the layer by pressing / and then fill, but there’s an easier way. Pressing Option + Shift + Backspace or Command + Shift + Backspace fills with the foreground or background color while preserving transparency.


Pressing Command + Shift + Backspace to preserve transparency while filling.
Blending Modes
You can cycle through blending modes or jump to a specific one by using just the keyboard. By pressing Option + Shift + (+) or Option + Shift + (-), you can cycle forward or backward through available modes. Alternatively, you can set a specific mode using the shortcuts below.

Typesetting
Setting type is a delicate and time-consuming process, but shortcuts speed it up. First off, hiding the inversed block that is created by selecting text is extremely beneficial. Command + H allows you to toggle the visibility of both the highlight and baseline stroke, making it easier to see the final result. When finished editing your text, you can commit changes by pressing Enter on the numeric keypad or Command + Return. Pressing Esc discards changes.

Variants
There are six shortcuts for changing the font variant, but they should be used with caution. If the appropriate variant or character does not exist within the currently selected font family, Photoshop creates a faux variant. These fake variants are frowned upon within the typosphere and are extremely easy to spot. So, if you use these shortcuts, make sure that Photoshop has selected an actual variant and not faked it. Now, onto the shortcuts:

Justification
To set the justification, use one of the commands below. Note that a selection must be made within the target paragraph for these to work.

Spacing and Sizing
Properly sizing and spacing type is a tedious task, but Photoshop does provide some handy—albeit broad—shortcuts. Unfortunately, there is no way to fine-tune the increments by which they adjust. Note that these shortcuts will work only if a text selection is made; selecting a type layer is not enough. To change the type size by increments of 2, press either Command + Shift + < or >. To bump the increment up to 10 points, use Command + Option + Shift + < or >. Leading can also be modified by 2 or 10 point increments using Option + Up or Down arrow or by Command + Option + Up or Down arrow.

The arrow keys can also be used to adjust kerning and tracking. Pressing Option + Left or Right either kerns or tracks 20 units depending on whether or not a type selection is active (i.e. if the cursor is between two characters, kerning is applied; if multiple characters are selected, then tracking is adjusted). The increment can also be changed to 100 units using Command + Option + Left or Right arrow. Finally, the baseline can be shifted by 2 or 10 points using Option + Shift + Up or Down arrow or Command + Option + Shift + Up or Down arrow, respectively.

Resets
Sometimes, we have to return to the defaults. Below are some shortcuts to get you back on track.

Menus
Hidden within many of Photoshop’s menus are a number of shortcuts that make adjustments faster and easier. Just about every menu—whether for Adjustment, Filter or anything else—allows you to revert to the original settings; by simply holding Option, the Cancel button will turn into a Reset button. Depending on the menu, holding Option might even change some of the other buttons (e.g. the Done button in the “Save for Web and Devices” menu will change to Remember). Certain menus, such as the Filter Gallery, also allow you to hold Command to turn the Cancel button into a Default button.

Using modifier keys to uncover in-menu options.
Spring-loaded Commands
By default, most menus transform the cursor into the Hand tool or Move tool. These tools can be used on the canvas while the menu is open to pan the document or to adjust settings, such as the Angle and Distance settings for a Drop Shadow. More tools, however, are available via spring-loaded shortcuts. The zoom tools can be accessed using either Command (to zoom in) and Option (to zoom out) or Command + Space (to zoom in) and Command + Option + Space (to zoom out). The hand tool can also be accessed by holding the space bar.

Holding Command + Spacebar to access the zoom tool within the Blending options.
Adjustment Menus and Layers
The Curves adjustment, like most other adjustments, contains some handy shortcuts. Similar to how you can cycle through the Channels in a document, you can cycle through the adjustment’s channels using Option + 2, 3, 4, 5, etc. You can also cycle through the points on the actual curves using - and =. With a point selected, you can nudge the points in increments of 2 in any direction using the arrow keys. Holding Shift in conjunction with the arrow keys moves the point by 16 units. When working with an adjustment menu, you can toggle the Preview option on and off by pressing P. Adjustment layers don’t have a Preview option, but you can temporarily disable it by pressing and holding \.

Summary
Hopefully, reading this has taught you a few new tricks and uncovered for you some of the more obscure options within Photoshop. While memorizing shortcuts can be a chore, integrating them into your daily workflow saves you an incredible amount of time. Do you have other obscure time-savers? Share your favorites in the comments!
Related Articles
(al)
© Thomas Giannattasio for Smashing Magazine, 2010. | Permalink | 149 comments | Add to del.icio.us | Digg this | Stumble on StumbleUpon! | Tweet it! | Submit to Reddit | Forum Smashing Magazine
Post tags: photoshop
-
This bad-boy-in-a-shell could be used as inspiration for body armor, according to scientists. Meet the Crysomallon Squamiferum, or 'scaly-foot gastropod.' He could end up saving your life.
Hailing from the Central Indian Ridge, the snails can ward off attacks from crabs and other menaces thanks to what its hard shell is composed of. Inside hydrothermal vents iron sulphide particles are found, and combined with a spongy middle layer it means that when something strikes it—like a mean crab's claw—it absorbs energy by allowing the shell to crack, or "microcrack" as the scientists at the Massachusetts Institute of Technology are calling it.
The shells also offer a form of attack, as well as defense. In a small way, at least. The iron sulphide will apparently make any attacking claws blunt, by grinding them down.
Whether we'll see it on the next stab-proof vests is anyone's guess, but at least we now know to avoid these scaly-foot gastropods. I'm certainly not going to eat any when I'm next in France, anyway. [New Scientist]
-
Posted: January 19th, 2010, 1:40pm EST
It looks like Microsoft has moved to the "sticks and stones" method for handling public relations gaffes. As we reported yesterday, France joined Germany in suggesting that its citizens switch from Internet Explorer to, well, anything else. Now, Microsoft's UK security chief, Cliff Evans, has responded by saying that switching to other browsers will only open you up to more security vulnerabilities than staying with Internet Explorer.
That's saying a lot for the browser implicated in the Great Google Caper of 2010 and we have multiple security experts who said a lot on why it just isn't true.
Sponsor

In a conversation with TechRadar, Evans said that "the net effect of switching [from IE] is that you will end up on less secure browser" and that "there are broader risks and issues with other browsers."
Internet Explorer: The Reigning Champ of Security?
These statements just didn't ring true in our ears, so we got in touch with Thomas Kristensen, the chief security officer for Secunia, a company that specializes in looking for security vulnerabilities.
"In my opinion the browsers aren't the real problem for most users," Kristensen told us. "The main concern for normal users is by far all the third party programs, such as programs from Adobe, Sun, Apple, and many other vendors, which are being exploited."
Browsers, whether Mozilla Firefox or Internet Explorer, update themselves requiring little if any user involvement, he said, so most vulnerabilities are taken care of. With other programs, however, updates often sit waiting for "months and even years before they update."
Kristensen did concede, however, that the latest versions of Chrome, Firefox and Opera currently have no un-patched vulnerabilities and are therefor a more secure choice compared with IE, while offering the same caveat.
"The normal user faces the almost same risk whether they run IE, Firefox, or Chrome if they haven't updated all their software," said Kristensen.
Vincent Steckler, CEO of anti-virus software provider Avast, agreed that Evans' statement didn't really add up.
"Other browsers may also have vulnerabilities but to suggest that changing browsers can increase vulnerability is not correct," he told us this morning. "It is changing from the known to the unknown - while it may not increase your protection, it will not decrease it."
IE 6: The Gift That Keeps On Giving
So, while Evans' statement doesn't really hold much water according to security experts, he does note later in the TechRadar article that "the reality of the risk is minimal, even if you have IE6; you would have to go to a website running the exploit."
On this point we can find some agreement. Michael Sutton, VP of security research at security provider Zscaler, notes that a switch may be a wasted effort, except for in one case.
"Switching browsers in response to a single vulnerability is a wasted effort. All browsers have vulnerabilities," said Sutton. "So what happens when you switch to Firefox and they announce a critical vulnerability? The larger story here is that the attack succeeded by targeting users running IE6 - an 8-year-old browser."
Whether you switch browsers or not, there is one thing for sure - you need to stop using Internet Explorer 6 already. In the end, though, it doesn't come down to running an ancient browser, as the vulnerability may go well beyond that.
"Currently it is evident that running IE6 on XP or Windows 2000 is a very bad idea, and any other browser would be a better choice for XP and Windows 2000 users," Kristensen told us. "It is also evident that there is an unpatched vulnerability in IE7 and IE8 which may or may not be exploitable on Vista and Windows 7."
We have to admit, the French may be right on more than red wine and food. Go get yourself a copy of Chrome, Firefox or Opera if you haven't already.
Discuss


-
-
-
Watching this ad for Grasshopper phone systems, you might not notice anything amiss. Watching this ad for Grasshopper phone system while fast forwarding, you still probably won't notice anything amiss. And that's the whole point.
The ad foils commercial-skipping DVR users by planting a brand icon—that grasshopper there—in the middle of the screen throughout the ad, and ending with a simple information panel. It looks more or less the same whether viewed at regular speed or high speed, so even if ad-skippers don't have to sit through the audio pitch, they still end up absorbing some of the ad's information, in theory. Another neat trick: By using this gimmick, Grasshopper has fooled numerous bloggers into posting about their ad. Planning on spending your commercial break browsing Giz? Ha. Grasshopper'd.
If they have the choice, people don't watch ads, and increasingly, people do have a choice. I imagine we'll see more than a handful of awkward stunts like this over the next few years, at least until traditional TV advertising falls by the wayside, replaced by something more akin to the unskippable ads we're starting to see in online video. [Adrants via Gawker]
-
Posted: January 19th, 2010, 12:45pm EST
It's no secret that Facebook founder Mark Zuckerberg is interested in scooping up more startups in order to bring their talent on board. From Firefox creator Blake Ross's Parakey (acquired in 2007) through Gmail creator Paul Buchheit's FriendFeed (acquired in 2009), Facebook has made some very high-profile talent acquisitions already.
This Fall, Zuckerberg got early access to his old friend Adam D'Angelo's new question and answer site Quora and used it to ask: "What startups would be good talent acquisitions for Facebook?"
Sponsor

Other users of the site offered suggestions and people voted on those submitted company names. Quora is a tiny new site chock-full of Silicon Valley stars - guess which company was voted the best acquisition target?
The winner? Apture.com, the provider of rich multi-media embedded pop-up windows for newspapers and blogs. Founder Tristan Harris is a former Apple engineer who built the first ad server for Wikia, the for-profit arm of Wikipedia, before launching Apture 3 years ago. We've given the product a positive review.
The next most popular suggestion? Austin, Texas location based social networking service Gowalla. Gowalla is run by CEO Josh Williams, who previously built and sold small business invoicing service Blinksale.
Those sound like good suggestions and both got votes from other Facebook team members on Quora. Remember, this isn't about what technologies should be integrated directly into Facebook - FriendFeed has become little more than an occasional test bed for Facebook feed developments. The question is about scooping up teams of red-hot developers.
Other suggestions offered include Dodgeball co-founder Dennis Crowley's new location based social network Foursquare (it's only a matter of time until Facebook starts doing location check-ins, right?) and social question answering service Hunch, built by Flickr co-founder Caterina Fake and engineering whiz Chris Dixon.
Who do you think would make a good talent acquisition for Facebook? Mark Zuckerberg wants to know.
Discuss


-
-
Here's what we know, from MacRumors: last July, Apple dummy corporation Slate Computing, LLC applied for a trademark for an "iPad." Similar applications have since been filed in England, Australia and Hong Kong. Also: what a terrible name.
We'd heard rumors of the iPad starting way back in August, when it appeared on a mysterious Border's survey. Since then, though, iSlate has been the frontrunner. But with some of the iPad applications being filed just this week, we may be looking at an awkwardly named tablet device indeed.
The first reactions here at Gizmodo HQ were that it sounded like anything from a feminine hygiene product to a terrible way to nickname your apartment, but it turns out MADtv beat us to the punch:
With all the lawsuits Apple's already facing, can they really stand another from a defunct late-night sketch comedy show? Guess we'll find out soon enough! [MacRumors]
-
-
This seems like a harmless tube. In fact, it was harmless: Jewish farmers used the first version to scare birds from crop fields. Then, somebody converted it into a crowd dispersion mechanism. And then, they discovered it could kill.
The Thunder Generator uses mixture of liquefied petroleum, cooking gas, and air to create explosions, which in return generate shock waves capable of stunning people from 30 to 100 meters away. At that range, the weapon is absolutely harmless, making people run in panic when they feel the sonic blast hitting their bodies. However, at less than ten meters, the Thunder Generator could either cause permanent damage or kill any person.
It comes in a single-barrel configuration, but according to the manufacturer—ArmyTec—you can mount it everywhere, and combine it with other barrels to create even more powerful design. You can even mount several cannons on different places, and synchronize them so you can create a sound barrier perimeter capable of dissuading your enemies. In fact, you can even make the sonic wave to turn 90 degrees to fire around corners, all by using a curved barrel design.
I can wait these people to install a sightly-lower power version of these things in raving clubs everywhere. My bones and ears are not crushed enough. [Thunder Generator via Defense News]
-
-
-
Posted: January 19th, 2010, 11:54am EST
A third of all Internet users in the U.S. now post status updates on social networking services like Twitter and Facebook at least once per week. According to new data from Forrester Research, more than half of what the report calls "conversationalists" are female and 70% are 30 years old or older. Forrester's data also shows that 59% of all U.S. Internet users now use social networks and that 70% consume content on social media and social networking sites.
Sponsor

As Forrester analyst Josh Bernoff notes, two years ago, when the company first looked at similar data, people's online behavior with regards to creating and consuming content was very similar to what Internet users are doing today. One major difference, however, is the rise of conversational interactions. People still blog, comment and vote on social news sites like Digg and Reddit. Over the last two years, however, the fastest growing group in Forrester's surveys have been conversationalists who use Twitter and Facebook to post status updates and engage in conversations with their friends.
More People Join Social Networks - Number of Creators Remains Stable
Creators - those who publish their own blogs or upload audio they created - now make up 24% of all Internet users. Joiners - those users who maintain a profile on a social networking site - make up 59% of all users. Interestingly, while the number of joiners has grown rapidly, the number of creators has remained relatively stable over the last few years. This makes sense, though, given that it's very easy to join a social network but relatively hard to create a podcast or maintain a blog.
Forrester classified 17% of all respondents as "inactives." These users don't participate in social networking activities at all.

Discuss


-
-
-
Yes, the Apple Tablet is coming next week! But do you know what gets me even more excited? A new version of the iPhone. But how will it be different? Let's look at the rumors.
Will it be announced on January 27th?
While the original iPhone was announced in January 2007, a full six months before it was released, the 3G was announced two months before its release and most recent version, the 3GS, was announced a mere month before its release. There's no real reason for Apple to announce a new version of the iPhone months before its release at this point, and if they really are announcing the tablet on the 27th, there's no reason to overdo it by announcing both. The only way they'd announce it next week is if it was being released much sooner than anticipated. Probability: 20%
When is it coming out?
Yes, a new iPhone will be released this year. Foxconn, Apple's main manufacturer, is rumored to have already received the order. But when, exactly, should we expect to see it?
If Apple continues along the schedule they've stuck to for the past three iterations, look for the iPhone 4 to drop this summer. The original iPhone dropped on June 29, 2007, the 3G came on July 11, 2008 and the 3GS arrived on June 19, 2009. While there have been rumors about a new iPhone showing up in April, those are sketchy at best. The good money is on late June/Early July. Probability: 95%
Will it run on a 4G wireless network?
The 3G and 3GS both run on AT&T's 3G network, with the 3GS supporting the speedier 7.2 Mbps HSDPA network. AT&T is also working on its 4G LTE network, and some people think the next-gen iPhone could run on that.
It's unlikely. 3G networks were technically available when the first iPhone was released, but Apple held off until the network was robust enough to handle a good number of people before releasing the 3G. And LTE phones are probably a good six months off still, so expect the new iPhone to continue running on the 7.2 Mbps HSDPA network.
The good news is that the network is far from running at full capacity, so as AT&T beefs it up we should see speeds increase until the v5 LTE iPhone shows up in 2011. Probability: 10%
OMG is it coming to Verizon?!
One analyst seems to think so, and he also claims Apple and Verizon are disagreeing on pricing. Unfortunately, these claims are just his assumptions and aren't based on any solid information, as is analyst's wont.
The real motivation for Apple to bring the phone to Verizon is that AT&T's serious network limitations in NYC and SF have given the iPhone's once-sterling reputation a black eye. Add to that the fact that Android is starting to encroach on Apple's hype train, and you've got the makings of a good time to expand to other networks.
However, the fact that Apple would need to make a totally new iPhone to run on Verizon's (and Sprint's, for that matter) CDMA network is a big roadblock here. It's not insurmountable, however. Verizon would have to be willing to play ball (although they've given hints of that lately), and a lot would have to be worked out.
Our guess is that this is still another year away. After all, both Verizon and AT&T are turning to LTE for their 4G networks, which would make it easier to release one LTE iPhone for both networks. And we all know how Apple likes to keep its product lines simple. Probability: 30% that it happens this year, 60% next year

What processor will it have?
The sketchy source that claimed the new iPhone would be out in April also claimed that it will feature a multi-core ARM Cortex-A9, capable of speeds over 2GHz. While the source isn't great, this part of the rumor isn't out of the realm of possibility.
Another option is Apple using chips designed by PA Semi, their in-house chip foundry. There are rumors of PA Semi chips running the forthcoming tablet, and it would make sense that Apple would go a similar route for the next iPhone. Specs are unclear, but it's safe to say that it would be a bump up from the 3GS.

How much storage will it have?
64GB, probably. Both Samsung and Toshiba have some new 64GB NAND chips that are exactly what Apple would put in an updated iPhone. And the 3GS already has 32GB, so doubling that number is a pretty obvious upgrade. Probability: 95%
What about the graphics chip?
Imagination Technologies, the company behind the iPhone 3GS's PowerVR SGX535 GPU, recently announced the next version in that line, the SGX545. It has OpenGL 3.2 and Open CL 1.0 support, runs at 200MHz, supports DirectX 10.1 and can do HD output. It seems like a natural next step for the guts of the iPhone, unless Apple wanted to keep the product line simpler by continuing to use the 3GS GPU for another year. Another GPU upgrade would allow for more visually impressive games, just not on older models. Probability: 85%

Will it have video chat?
This was strongly rumored for the 3GS, but didn't happen: a second camera on the front of the phone, allowing for mobile video chat. Jesus wants it very badly.
The main argument against this happening is that AT&T's network just couldn't handle it, which is probably true. But it could be done with a Wi-Fi-only implementation. Then again, maybe it's just one of those features that just sounds better than it actually is; the idea of holding your phone up in front of your face at arm's length seems pretty stupid to me. Probability: 30%
Potential New Features

A High-Res AMOLED Screen:
The iPhone's screen is starting to look a little dated when compared to the beauties found on the Motorola Droid and the Nexus One. The Droid's screen is 3.7 inches with a 480x854 resolution, while the Nexus One sports a particularly lovely 3.7-inch AMOLED screen with a 480x800 resolution. Compare these numbers to the iPhone, which sports a 3.5-inch LCD screen with a resolution of 320x480, and it becomes clear that a screen upgrade is inevitable.
Furthermore, Apple filed a patent for a slimmer, lighter dual-function touchscreen back in 2008. The new touchscreens feature capacitors included in the pixels of the screen, able to operate individually, eliminating the need for a touch sensor panel overlaid on the display. This would allow the screens to be manufactured more cheaply and easily while also allowing for a thinner profile.
Whether or not the new screens are AMOLEDs or Apple's new LCD technology, the chances are good that the resolution will get a bump. The trouble is that all of the apps in the App Store have been coded for a native resolution of 320x480, so a lot of work will have to be done to get those upscaled for a higher-resolution screen. That's no reason to keep a last-gen screen on a new product, however, so we think a resolution upgrade is highly likely. Probability: 90%

A Stylus:
A recently-unearthed Apple patent shows an iPhone being used with a stylus with a conductive tip. The patent was filed back in July of 2008, however, so this seems like more of an ass-covering patent than a product-defining patent. After all, Steve famously said "yuck" to styluses at the first iPhone keynote. So the chances of the new iPhone coming with a stylus are slim to none. Probability: 5%
Removable Battery:
The same flimsy source that claimed that the new iPhone will be released in April also said we should expect a removable battery. This is highly doubtful. Apple has just revamped all of its laptops to have non-user-removable batteries, why would it suddenly do an about-face with the new iPhone? Don't count on it. Probability: 5%
Touch-Sensitive Casing:
This is an interesting one. A Goldman Sachs analyst seems to think that the back of the new iPhone will be touch-sensitive, like the Magic Mouse. This would allow for gesture-based control, like scrolling, without your fat fingers blocking the screen. This one's purely speculative, but makes a certain amount of sense. Probability: 35%

Wireless N Support:
This one is pretty obvious. The newest iPod Touch already has a Broadcom BCM4329 chip inside that supports 802.11n and FM transmission, so it's natural that the next iPhone would get the same thing. A recent job posting by Apple for a Wi-Fi software engineer just adds credence to the rumor. Probability: 95%

5 Megapixel Camera:
Digitimes claims that OmniVision Technologies, the company behind the iPhone 3GS's 3.2-megapixel CMOS image sensor, has won a new contract with Apple to produce millions of 5-megapixel sensors this year. This one makes sense, as the MP count (as well as storage size) is one of the most basic ways to show that the phone's been upgraded. Probability: 95%
LED Flash:
On the one hand, the iPhone's camera could be better, especially in low light, and a flash could help with that. On the other hand, cellphone flashes are almost universally terrible and useless. Nevertheless, there's a rumor out there that Apple has ordered "tens of millions" of Philips' LumiLEDs. Probability: 60%

Push-Button Antenna:
Apple filed a patent for an antenna that pops out like a button. This looks to pretty clearly them covering their asses rather than leaking new product designs, so don't count on seeing a big, ugly antenna button popping out of the top of the new iPhone. Probability: 5%

Spongey Dock:
This is another weirdo patent, one that in all likelihood will never actually be made. Probability: 5%

A Bumpy Screen:
Yet another patent that could be for a tablet or a phone, this shows a touchscreen device with a screen that "create[s] physical bumps or dots for the user to feel when it is in keyboard mode." Interesting! But also, merely a patent, and a left-field patent at that. Probability: 5%
-
-
Posted: January 19th, 2010, 10:45am EST
Celebrate three-quarters of a century of a nautical clothing icon with the Sperry Top-Sider 75th Anniversary Collection ($55-$88). Created in 1935 by sailor Paul Sperry, who created the sneakers' unique...
Visit
Uncrate for the full post.
-
That's right, y'all. We're back at it, and this time we've received some exclusive iPhone OS 4.0 details from one of our trusty Apple connects.
Here are some iPhone OS 4.0 features, according to our guy:
• There will be multi-touch gestures OS-wide. (Would make sense for that as the rumored OS for the iTablet is close if not the same as the iPhone)
• "A few new ways" to run applications in the background - multitasking.
• Many graphical and UI changes to make navigating through the OS easier and more efficient. We haven't had this broken down, but we can only hope for improved notifications, a refreshed homescreen, etc.
• The update will supposedly be available for only the iPhone 3G and 3GS, but will "put them ahead in the smartphone market because it will make them more like full-fledged computers" more than any other phone to date. Everyone is "really excited."
• The last piece of information is the most vague, but apparently there will be some brand new syncing ability for the contacts and calendar applications.
That's all we have for now! Who can't wait for next Wednesday?
Thanks, Lindsey!
BGR features the latest tech news, mobile-related content and of course, exclusive scoops.
-
Amidst my personal quest for a simple steam basket, I came across a serious steamer fit for any Giz reader, the Morphy Richards Intellisteam.
Yes, that's a backlit blue LCD you see, allowing you to control three separate steaming pods, each with their own steam controls (loaded with plenty of presets that make steaming various different foods simple).
Aside from all that practicality, the Intellisteam sounds like it performs dutifully, with instant steam, a visible water gauge, auto-off when water runs out and up to 40 minutes of food warming.
Making a meal for up to 4 people, the Morphy Richards Intellisteam is available now for about $160. Oh kitchen gadgets, how I neither need nor resist you. [Morphy Richards via Appliancist]
-
The Video Electronics Standards Association has codified the standard for the next version of DisplayPort, and the small, Apple-loving HDMI competitor, and it just got a lot more interesting. Like, multiple-monitors-on-one-plug interesting.
The concept of daisy-chaining multiple monitors on one DisplayPort connection has been part of the vision all along, but version 1.2 will be the first to actually support the technology—at this stage, up to four at a time, at a resolution of 1920 x 1200. On top of that, it'll bring full HD, 120fps-per-channel 3D support, a 21.6Gbps data rate, and bi-directional USB data, meaning that anything connected to a DisplayPort 1.2 cable could serve as a high-bandwidth USB hub.
And of course, VESA's already accepted Apple's miniaturized version of the port into the DisplayPort family and audio support is still present—albeit not in Apple's variant. In other words, no, the battle isn't settled, and HDMI hasn't won—even forthcoming HDMI 1.4 hardware can't hang with the next generation of DisplayPort hardware, if anyone decides to actually make it. [PC Authority]
Milpitas, Calif., Jan. 18, 2010 — The Video Electronics Standards Association (VESA) today formally unveiled the industry's most innovative and flexible digital communication interface standard for transporting display, audio and other data.
VESA's DisplayPort Version 1.2 is a comprehensive extension to the original DisplayPort standard offering many new benefits to the end user. Benefits include: double the data rate of the previous DisplayPort v1.1a standard (enabling higher performance 3D stereo displays, higher resolutions and color depths, and fastest refresh rates); multiple monitor support from a desktop or notebook computer using only one DisplayPort connector; the ability to transport USB data between a PC and Display, supporting Display USB functions such as a webcam and USB hub. DisplayPort v1.2 is backward compatible with existing DisplayPort v1.1a systems, including existing cables and the Mini DisplayPort connector.
DisplayPort v1.2 increases performance by doubling the maximum data transfer rate from 10.8 Gbps (Giga-bits-per-second) to 21.6 Gbps, greatly increasing display resolution, color depths, refresh rates, and multiple display capabilities.
DisplayPort v1.2 supports "multi-streaming" — the ability to transport multiple independent uncompressed display and audio streams over a single cable, supporting protected content and high performance applications such as 3D gaming. This enables the use of multiple monitors connected by cable in a daisy chain or hub configuration. Whereas the current Display v1.1a standard can support one 2560 x 1600 monitor at 60Hz, DisplayPort v1.2 can support two such monitors with one cable, or four 1920 x 1200 monitors. Many other combinations are possible, including multiple video sources, multiple displays (even at different resolutions) and multiple audio speakers.
Another new feature is the ability to support high-speed, bi-directional data transfer, allowing USB 2.0 or Ethernet data to be carried within a standard DisplayPort cable. For DisplayPort v1.2, the maximum data rate of this "AUX" channel has been increased from 1 Mbps (Mega-bit-per-second) to 720 Mbps, providing suitable bandwidth for USB 2.0. The DisplayPort cable can therefore support USB data to/from the display to support Display USB functions, in addition to sending the video and audio information. Standard Ethernet can also be transported in the DisplayPort cable.
DisplayPort v1.2 was designed to be compatible with existing DisplayPort systems and cables. To take advantage of the new capabilities, a PC will need to be DisplayPort v1.2 enabled, however existing standard cables can still be used, including those with the new Mini-DisplayPort connector. To achieve the 21.6 Gbps rate, the per-lane data rate is doubled from 2.7 Gbps to 5.4 Gbps, over the four lanes that exist in the standard cable. For a single display, this enables up to 3840 x 2400 resolution at 60Hz, or a 3D display (120Hz) at 2560 x 1600.
DisplayPort v1.2 also adds new audio enhancements including the following:
— Audio Copy Protection and category codes
— High definition audio formats such as Dolby MAT, DTS HD, all Blu-Ray
formats, and the DRA standard from China
— Synchronization assist between audio and video, multiple audio channels, and
multiple audio sink devices using Global Time Code (GTC)
DisplayPort v1.2 also includes improved support for Full HD 3D Stereoscopic displays:
— Life-like motion using up to 240 frames-per-second in full HD, providing 120
frames-per-second for each eye
— 3D Stereo transmission format support
Field sequential, side by side, pixel interleaved, dual interface, and stacked
— 3D Stereo display capability declaration
Mono, Stereo, 3D Glasses
"DisplayPort is a truly open, flexible, extensible multimedia interconnect standard that is ubiquitous in the PC, notebook and display markets and is rapidly gaining traction in consumer electronics applications," said Bill Lempesis, VESA's executive director. "DisplayPort Version v1.2 offers a complete set of benefits and capabilities that no other standard can provide. It is completely backward compatible with DisplayPort v1.1a and requires no new cables or other equipment, making it the standard of choice across the industry.
-
-
-
Posted: January 19th, 2010, 10:05am EST
Just in time for tax season, online bookkeeping service Outright.com will begin providing a 1099 tax filing service for entrepreneurs and sole proprietors on top of its current W-9 service. The site is also launching what they say is the first community for the self-employed where startups and entrepreneurs can find bookkeepers.
For most of us, tax day is April 15, but for entrepreneurs required to meet the February 1 deadline for providing 1099 forms to contracted employees, the madness starts now.
Sponsor

"Startups working with contractors should have collected form W-9 by now," Outright's Paul O'Brien told ReadWriteWeb. Using those W-9 forms from users and their contractors, the site does the rest - automatically filling out 1099's, e-filing them with the IRS and sending copies directly to the contractors.

Starting tomorrow, the new 1099 service will cost users $5 per filing, though for each contractor that joins Outright after their 1099 is filed, the site will refund their $5 fee. The fee for the 1099 can be deducted as a business expense on the user's personal tax return.

The site will also be rolling out a social directory to help connect entrepreneurs and startups with Outright's expanding community of bookkeepers. O'Brien says that there are a few thousand bookkeeping professionals using Outright, and this new directory will help them find businesses who need help around tax season.
Outright claims it is tracking over $1.2 billion worth of self employed and startup business, an increase of 21% from just three months ago when it announced tracking $1 billion. Self-employed individuals make up 75% of Outright's users, and the majority of the remainder employ fewer than 10 people.
Discuss


-
-
-
Posted: January 19th, 2010, 9:00am EST
From the menus of David Chang's white-hot NYC restaurants Momofuku Noodle Bar, Momofuku Ssäm Bar, and the ultra-intimate Momofuku Ko comes Momofuku ($27). Co-authored by Chang and NYT writer Peter...
Visit
Uncrate for the full post.
-
Everyone is trying to guess what the features are of the tablet that Apple may announce on Wednesday 27. What's its name? What's the OS? How big? Tell us what you think and win an Apple tablet.
Rules
Apart from the usual Gawker legalese, here's it how it works:
• You fill out the survey linked below before the Apple event, and whoever gets closest to having all the answers right is eligible to win a free Apple tablet—whatever it ends up being called—courtesy of us.
• If the final feature is not exactly like one of the answers we provided, we will pick the closest answer. If the feature is not in the answers, that question will be void, but the rest of the questions will still be valid towards winning.
• There is a reasonable chance that many people will get the correct answers. In the event that there are, all of those who made the cut will go into a drawing, from which we'll pick a winner at random.
Click here to complete the survey of features. The winner gets an Apple tablet.
Your name and email will only be used to contact you in case you win the tablet.
Here are my guesses:
Name
I think they will call it iBook, just because it's a good brand, a short name that sounds great, and ties in with the whole tablet format.
OS
The tablet will run a variant of iPhone OS, with additional software classes to address its special features. Fundamentally, it will be like the iPhone OS—it should be able to run apps straight away (although developers will tailor them to the new screen size, selling them in the app store as fatter apps that support both the iPhone OS and the Tablet OS).
Screen
The screen won't be OLED, but I would like to think that—given Apple's push towards LED backlighting, with its energy savings and better image quality—they will use a 10.1-inch LCD-LED display.
Connectivity
The connectivity is a tricky one. Since I believe the Apple Tablet is a complete new paradigm in computing, one goes away from desktop metaphors, and is always connected—it makes sense that it supports 3G. But would Apple tie this thing to a carrier, like some rumors say? And if they do, and it's AT&T, would I be able to have two SIMs under the same AT&T number?
Camera
Another tricky one. Some people say no webcam at all, other say no cameras at all, others say both. I want to believe that this thing will, at last, support videoconferencing.
Storage
The top model will have 64GB.
Material
I like the idea of the back being chrome, so I can touch up my makeup.
Keyboard
Another tricky one. I want to believe that Apple is including a stylus and that their handwriting technology—already present in Mac OS X, coming from Newton OS—is good enough. However, this will require multiple-language support, something that doesn't seem to be implemented right now. So I want handwriting, but I'm leaning to a screen-based keyboard.
User interface
The iPhone has been a huge hit because it's simple. No complicated desktop metaphors, no confusing windows, just a modal device that morphs into different devices. Normal people, regular consumers who hate normal computers—the majority—get it. It will be like the iPhone, modal, hopefully with aggressive multitasking, and a clever way to navigate through running applications.
Extras
Another wild guess. USB 3.0 support would be nice, or even Lightpeak, but I really want this thing to support a stylus.
Battery life
This could have 10 hours of battery life. If its guts are not much different than an iPhone, there will be a lot of empty space in there, enough to fit some extra battery cells.
Price
People are guesstimating a wild range. Mine: $600, and they will still make money out of it. My gut feeling is that Steve Jobs and Co. believe this will be their biggest contribution to computing since the original Apple Macintosh. And they will want it to be cheap, so it can spread quick, like wildfire.
Main functions
Like the iPhone was a phone, an iPod, a web browser and a mail machine, this device will also have three or four main functions (apart from the thousands that it can take thanks to the applications). My wild guess is that movies will be a good one, as will web, ebooks, and videochat/communication.
Main role
While many computer fans will see this device as a secondary device or a peripheral, I believe Apple will position it as a full computer. Like I said before, most people don't need a computer. Most people don't spend hours writing emails or documents outside of the office. Most people don't spend hours doing spreadsheets or painting photos outside of work mode. Most people just browse, send the occasional image, do some chat, access Facebook, tweet a bit, read, browse, watch movies, listen to music... that's why the iPhone has become such a driving force in the industry, with many regular consumers adopting it as their main computing device. My guess is that this computer will be the main computer of most of the people who buy it. Not for the office, but their personal computer.
Now it is your turn to give us your guesses, and get a chance to win an Apple tablet.
Click here to complete the survey of features. The winner gets an Apple tablet.
Your name and email will only be used to contact you in case you win the tablet.
-
-
This week on TreeHugger, the newest electric cars, solar powered dogs, cardboard computers, self-assembling solar cells, and how Apple will control your energy in the near future.
LG Unveils New Flexible e-Ink Newspaper, No One Gets Excited
LG, for reasons no one has been able to really guess yet, decided to wait until after CES to announce their newest digital contraption intended to take the place of newspapers - a 19" flexible digital display.
Hi-Tech, Satellite-Controlled Robot 'Gliders' to Scour Ocean Depths Up to 3,280 Ft
Sure, they look like torpedoes. But they're so much more useful. They cruise the ocean, exploring depths of over 1000 meters (3,280 ft)—and they use only as much energy as bike light in the process. A fleet of these robot gliders, which move across the ocean's surface like a sailplane, is being massed for their first 'swarm' mission in the tropical Atlantic.
Acer Unveils New Aspires As Their Greenest Laptops
Acer has launched two new notebooks, Acer Aspire 3811TZ and Aspire 3811TZG. They're part of the Timeline series, which touts a 40% energy efficiency improvement over traditional laptops, and these two notebooks are free of two toxic materials that many companies either have, or are working to eliminate from their laptop lineups as well.
Advocates for Electronics Producer Responsibility Speak Out Against NYC e-Waste Lawsuit
The e-waste collection battle heats up in New York City. Get the latest information from those who are backing the city's plan to have gadget producers pick up the tab - and the devices - from city residents who want to recycle.
Apple May Help Slice Home Energy Use With Smart Grid Project
Apple is going after the low-hanging fruit, and mulling a move into the energy management market. The company is developing a system to help you regulate and decrease the amount of power you use in your home.
2010 Detroit Auto Show: BMW ActiveE Electric Car
Most of you probably know about the MINI-E, an electric version of the MINI made by BMW to do real-world EV testing (and exploit a CARB loophole, some say). BMW says that it will repeat the experiment, but this time with the ActiveE, a converted BMW series 1 coupe. Get the latest on this, and many other electronic and hybrid car information from the Detroit Auto Show
Cardboard PC Concept Case Becomes Reality, Goes Into Mass Production
Remember a year ago when we showed you the ReCompute cardboard PC case dreamed up by designer Brenden Macaluso? We didn't think it was too hot of an idea but it looks like it got the support from elsewhere because the ReCompute has gone into mass production.
The Causeworld Mobile App: Go Shopping, Earn Karma, Save the Planet
It's called Causeworld and here's how it works: download the app for your iPhone or Android device, walk into a store and "check in" on your phone (geotagging helps determine where you're at), as you earn Karmas you spend them on causes like carbon offsets and tree planting. You don't actually have to buy anything, just divulge that you've set foot in that particular department store, grocery, hardware store, Abercrombie, etc. Corporate sponsors pony up the dough, you just decide how it's divvied up.
Self-Assembling Solar Cells Take Cue From Salad Dressing
The principle behind these self-assembling solar cells is one which I imagine every person who reads this is familiar with: Until you mix it together salad dressing stays neatly separated. Now take that idea—the hydrophobic and hydrophilic qualities of two liquids—apply it to manufacture of solar cells and you get a glimpse of the genius of this. Heiko Jacobs and Robert Knuesel, writing in Proceedings of the National Academy of Sciences, demonstrate that it can be done.
Solar Powered Dog Sweater Gathers Power From Your Pooch (Video)
How can you make your dog earn it's keep? Tape a solar cell to its sweater and add a battery pack to its collar, then send it outside. That's what Erik Schiegg has done with his Solar Dog prototype invention. Check out how your dog could be the solution to your charging woes.
TreeHugger's EcoModo column appears every Tuesday on Gizmodo.
-
Posted: January 19th, 2010, 8:53am EST
According to the analysts at research firm Gartner, mobile application stores are expected to generate revenues of nearly $7 billion over the course of this year. That figure is a combination of the $6.2 billion spent purchasing the mobile applications themselves combined with an additional $.6 billion generated through advertising revenues from in-app ads. Not surprisingly, Apple dominates this market, accounting for 99.4% of the market as of last year, states the report.
Sponsor

Over the course of 2009, mobile application download revenue exceeded $4.2 billion, with eight out of every 10 apps downloaded offered free to end users, says Gartner. Going forward, the analysts predict mobile application stores' revenue will grow to $29.5 billion by the end of 2013. That revenue, again, will be a combination of paid applications and free applications running ads.
3 Billion in Apple App Sales? Not Exactly
While we're sure the general trend is correct as far as the growth of mobile application stores and Apple's position as the market leader, we have to agree with the note that John Gruber recently made on his blog regarding these figures. He quotes a portion of the report where analyst Chris Foresman says:
Earlier this month, Apple announced that sales had topped 3 billion; that means iPhone users downloaded 2.5 billion apps in 2009 alone. Gartner's figures show another 16 million apps that could come from other platform's recently opened app stores, giving Apple at least 99.4 percent of all mobile apps sold for the year.
Gruber notes that Apple didn't actually announce 3 billion in sales, they announced 3 billion downloads. In fact, you can see the original press release making this announcement here. Not only that, but another Gartner analyst Miguel Fontanez told us earlier this month that Apple, as a rule, does not disclose App Store revenues as a separate line item in their revenue reporting. That means that any estimation of Apple's App Store sales are just that - an estimation.
Last week, in speaking with Peter Farago of Flurry analytics to calculate App Store piracy numbers, we determined that Apple had generated approximately $750 million in sales to date. That's 3 billion downloads over the lifetime of the App Store with roughly 25% of them being paid downloads. In other words, if Gartner used the 3 billion to determine Apple's position as the market share leader in sales, then their calculations would be off.
However, as Gruber also notes, if Gartner's calculations are accurate regarding the other mobile platforms (16 million in app sales, they claim), then it's clear that Apple still has the app store to beat... even if they don't account for 99.4% of the market.
We don't expect Apple's dominant position to change anytime soon - the company has momentum. In November 2009, Apple announced they offer over 100,000 applications and by now that number has likely grown even more. However, other mobile application stores are growing quickly, too. Google's Android marketplace, for example, with its open nature unhampered by any sort of bogged-down app review process, has now topped 20,000 applications as of December. The Android mobile operating system is growing in popularity, too (usage increased 3% over the past three months), meaning it will soon be a contender for a hefty slice of that the app store pie in years to come.
Discuss


-
Microsoft has agreed only to hold your personal information (read: darkest secrets] for six months, while Google and Yahoo will continue to keep them much longer to "improve search quality." By which, of course, they mean "ad revenue."
Granted, the Bing move comes after pressure from the European Union, who's fined Microsoft so many billions of dollars in the past that the latter is understandably twitchy. It's still a policy that should be applauded, though, to the same extent that Yahoo and Google's lack of improvement should be roundly booed. Google stores cookies for a year and a half, far longer than they should need it for any purpose other than sending you the perfectly targeted Bowflex ad.
If Google and Yahoo continue not to comply with the EU's wishes, the outcome could be fun to watch: more comically large fines for them, a less invasive search experience for you. Here's hoping. [WSJ]
-
Posted: January 19th, 2010, 8:43am EST
It's really rather irritating: you pay hundreds — if not thousands — for a new DSLR, only to find yourself becoming a walking billboard thanks to the gaudy included strap....
Visit
Uncrate for the full post.
-
-
-
Posted: January 19th, 2010, 7:30am EST
5 years ago I wrote a prediction about RSS here on ReadWriteWeb. I proclaimed that "in the not too distant future, more people will subscribe to topic/tag/remix feeds than feeds of actual people."
I think it's fair to say that I was totally wrong on that prediction. Thanks to Facebook and Twitter, in particular, many more people 'subscribe' to people than topics (subscribe a.k.a. 'follow' or 'friend'). And I'm glad my prediction didn't pan out, because the social graph of people is much more interesting to follow than a bunch of keywords. But it begs the question: what happened to all the promise of tracking topics using RSS?
Sponsor

While many of us use Google Alerts and apps like LazyFeed to track keywords and topics, that's still a relatively geeky thing to do.

In a follow-up post in January 2005, entitled Why Topic/Tag/Remix Feeds Are The Future of RSS, I wrote that "tools will evolve to let people easily set-up personalized searches for information relevant to them and subscribe to the results [using RSS]." I wasn't suggesting that conversations or people are unimportant. On the contrary, as I explained in '05, "topic/tag/remix feeds will make it even easier to find the conversations that matter to you and indeed you are more likely to meet new people and discover new points of view."
That has certainly happened, but not so much due to RSS - more because of Facebook and Twitter. While RSS did expand over those 5 years, social networking services became much more popular as ways to track information.
Also, online media has matured a lot over the past 5 years. Nowadays people commonly subscribe to blogs and other news media across a variety of niches - and that's how they keep up-to-date on topics of interest to them. For example, I subscribe to NPR All Songs Considered and Pitchfork (amongst other sites) to get the latest alternative music news.
Both of these trends (the rise of the Social Graph; and maturing of professional niche media) have made topic feeds from the likes of Google Alerts less attractive than I thought they'd be 5 years ago.
However, I still believe in the promise of topic-based RSS feeds. Indeed I currently use a number of services to track a set of topics of interest to me. One is Google Alerts, which I have set up as RSS feeds in Google Reader. Plus I use a couple of services that launched just recently, LazyFeed and Regator.

Sadly, the promising services of 2005 - such as PubSub and Feedster - haven't made it as far as 2010 (although last year PubSub was born again under new management).
It's possible that LazyFeed and Regator won't last either, but let's hope that a startup soon finds the key to unlock the potential of topic feeds.
In the meantime I'm curious to know if you subscribe to topic feeds? If so which tools, if any, do you use to track topics? Please leave a comment. I'll write a follow-up post later this week, highlighting the best apps that are mentioned.
Image credit: shizhao
Discuss


-
Say what you will about platforms, but in 2009, Apple's App Store absolutely pwnd the paid mobile app space—selling 99.4% of the $4.2 billion market single-handedly, according to ars technica.
All this data is based upon research by Gartner, who claims that, should sale trends continue, Apple could retain 2/3 of the paid mobile app market into 2010 (amidst growing competition from Android, Palm, RIM, etc). Of course, if Apple releases an app-wielding tablet, market share could error greatly in their favor again.
(Note: there's some discrepancy in these numbers, as Engadget counters ars' 99.4% number crunching with a 97.5%. Whatever, either way, it's enough of the market to mean every other retailer was moot in 2009.)[Ars and Gartner]
-
-


“We really love this new website you’ve built! Now we’d like to send out an email to all of our customers, friends and anyone, and it should look exactly like the website except with a spinning mailbox at the bottom, and have my photo, and my cat’s photo…” Ever had that conversation with a client? You’ve built plenty of websites in your time and could knock off a blog template in your sleep, but HTML email? Seriously? HTML email has the reputation (often well deserved) of being a horrible design medium.
The mere mention of it sends some designers into physical shock (try it if you ever get stuck in a tedious conversation about XHTML vs. HTML 5). The truth remains that businesses and individuals the world over send and receive email in HTML format by default every day, and many of them genuinely prefer it to plain text. So designers have a choice. We can stick our fingers in our ears, cover our eyes and hope it all goes away or we can learn to make the best of a challenging design medium and produce something that raises the quality level a bit.
This article gives you the information you need to plan, design and build an HTML newsletter that renders well and is actually useful to recipients. It’s a quick and dirty guide to effective email newsletters.
If you’d like to get started right now, here are the cheat notes to get you on the right track. Read on for more detail, examples and resources.
- Respect your reader. Don’t waste their time or attention.
- Ask nicely first.
- Focus on relevance.
- Design with a goal in mind, so that you’ll know if it worked.
- Make unsubscribing easy.
- Code like it’s 1999 (literally) and use inline CSS.
- Always include a plain text version.
- Don’t assume that images will be viewed.
- Follow the law.
- Test everything before sending, because you can’t take it back.
1. Respect Your Reader. Don’t Waste Their Time or Attention.
The email inbox is a noisy busy place for a newsletter to land. Hundreds of other emails are already on the pile, with folders, calendars and notes on all sides. The typical user is probably not waiting with bated breath for your email to arrive.
So when your email does arrive, make sure it doesn’t waste their time. Get to the point quickly, instead of burying the value under a mountain of greetings and headers and hilarious photos. Figure out why someone would want your email, and then tell them what that is right away.
One excellent example of getting to the point is the recent Haystack announcement. No need to guess what Haystack is for when you read the top of this email:

2. Ask Nicely First
When you are excited about something, you want to tell everyone. Clients often assume that everyone they have ever met, and many they have not, would love nothing more than to receive their latest news. Of course, this is not the case, and laws are in place to back them up.
If you are using an external email service, it will have its own policies on what permission you need in order to email people. Know which policies apply to you and your clients before you send. Explicit permission is best: ask people directly if they would like to receive emails about your topic. If you can show an example of what they’ll get and let them know how often they’ll get it, all the better.
People might forget actually asking to receive your email, particularly if they don’t send emails very often or signed up as a result of entering a competition. A short message at the top of your email will help people remember and make them more likely to read on. Here’s an example of a well-executed permission reminder:

In this case, the recipient gets an explicit reminder of the time and the place they gave their permission. Following up soon after the sign-up also ensures that the recipient doesn’t forget.
In 2006, Return Path conducted a survey that showed that “knowing and trusting the sender” was the biggest factor in whether recipients opened an email, so avoiding complaints of spam isn’t good enough.
3. Focus on Relevance
Even if you have met your legal obligations and have the explicit permission of your recipients, they don’t necessarily want to read your emails. Have you ever agreed to receive “special discounts” on an item, only to be bombarded by endless advertisements for different items from the same company? Sending valuable, relevant information to your subscribers is vital. You might not want to send information to everyone on your list just because you can. Consider carefully whether the information is useful to them and what they expect from you.
ISPs and email providers now consider relevance in their definition of spam, giving you even more incentive to focus on relevance.
4. Design With a Goal in Mind, So That You’ll Know If It Worked
Approach newsletter design as you would a website. Know why you’re sending the email and what result you want to achieve. We’ll cover this in more detail in the planning section below. The email below makes it very obvious what action its authors would like their subscribers to take:

Sit down with your client or boss and ask them plainly, “What is the one thing you want people to do when they get this email?” You might have to force them to pick only one to begin with! Designing to meet 10 different goals is hard, but you can design to support just 1 or 2. As we’ll discuss later, you can measure whether you’ve reached your goal in plenty of ways.
5. Make Unsubscribing Easy
We’re all tempted to hide the dull disclaimers and terms and conditions in Tiny Gray Font Land at the bottom of the page, but putting the “Unsubscribe” link there is a bad idea. There’s no point in emailing people who are not interested in your content any more. If your content is no longer relevant to them, let them unsubscribe easily. Making it hard will likely only lead to complaints of spam and leave people with a bad impression of your company.
Much better to make it clear and prominent; that way, if they decide in future that they would like to receive the information you’re offering, they will be confident in signing up.

It doesn’t have to be boring either. One of my favorites is, “You can unsubscribe instantly, but if you do we may scream, cry and then call you at 2:00 am begging you to come back. It’s your choice.” Not appropriate for every client, but you can have fun with more casual emails.
6. Code Like It’s 1999 (Literally) and Use Inline CSS
While most of us have put down our tools of trade from the browser wars, the fight goes on in the jungles of the email client, like those soldiers who don’t find out about the peace treaty until decades later.
Instead of a handful of browsers, we find more than a dozen major email clients, with HTML and CSS rendering ranging from great to appalling. So, to get decent results across a lot of clients, we’re back to using structural tables. Joy! Read on for tips and tricks to make coding the HTML and CSS in your design a not entirely frustrating experience.
Some email clients strip CSS out of the head but leave style blocks in the body (as invalid as this is). Gmail goes further and strips out all CSS from the head and body but leaves inline styling.

So, once you’ve completed your design, you will need to go through and add inline styles to your elements. Some email services help you with this; or you could use Premailer. You can also use some nifty tools for CSS inline styling, such as The Automatic CSS Inliner Tool or Inline Styler — the latter converts CSS rules into inline style attributes.
7. Always Include a Plain Text Version
Some people just don’t like HTML in their emails. They might be using older systems, or their system is locked down and they just can’t view HTML. Provide a plain text alternative to every email, so that the reader’s own email server or program can choose which version to display.
Again, your email service probably provides that capability. Plain text can be hard to read, so spend some time making it scannable and useful. Here is a recent example from Mark Hurst at Good Experience:

8. Don’t Assume That Images Will Be Viewed
If you have used Outlook or Gmail, you’ve seen that “Images in this email are not displayed” message many times. In many of the major email clients, your images will not be shown by default. Readers have to click a link or button to download and display them. Here is a recent email we saw. On the left is the intended design (well, the top half of it), and on the right is how it appears in Gmail by default. Not exactly clear!

You may be able to work around this with some types of embedded images, but they have their own issues, too. No matter how perfect your images are, they may have no impact, or even a negative impact, on the success of your email.
If your client insists on a pixel-perfect design, an all-image email may seem like a good option. But if images are not shown to the user, and they see no text, all they’ll get is a big fat annoying blank message. Always ensure that your email has HTML text as well as plain text. Many people might not realize they can choose to show images, and some just won’t bother. So you can’t assume that people will actually see your images at all. For a full rundown on what the default settings of each email client are, check out current conditions in image blocking.
How do you work around this? Here are a few ideas:
- Avoid images for important content such as headlines, links and calls to action.
- Add a prominent text-based link to a Web version of your newsletter.
- Get recipients to add you to their address book or whitelist.
- Use the
alt attribute for all images to give Gmail users a better experience. - Specify height and width for images to ensure that the blank placeholders don’t throw your design off.
- Test your design with images turned off before sending.
9. Follow the Law
Review any relevant commercial email regulations for your country. The best known of course are the US CAN-SPAM laws, but there are many others. For a great starting point, visit Email Marketing Reports.
You might need to include a physical building address in your email or include something like “[advertisement]” in your subject line. Many email marketing tools help you build templates with these required elements, to ensure your client does not send out emails without them.
Even though you may not be at risk for the largest CAN-SPAM fine ever, you could easily get into trouble with your email service if recipients complain and you have not adhered to the law. Legitimate providers have little tolerance for people who send emails that don’t meet legal requirements and could close your account or blacklist your server.
10. Test Everything Before Sending, Because You Can’t Take It Back
While reviewing current email client standards is a great start, nothing beats actually testing a newsletter in as many clients as possible. Several services help with design and spam testing, and the service you use may already have this built in. Make sure every link is working and that any personalization appears as expected. We always spot problems two seconds after hitting “Send,” so send some test emails to people who can give you feedback, and save yourself the despair of sender’s regret.
Tips, Tricks And Resources To Build Your Email
Though harder to find than general advice on Web design, plenty of help is available online for building a successful newsletter. Over at the excellent 24 Ways, Dave Greiner has a great list of technical tips and tricks that is worth reading in full (the comments, too). Here are a few of the best tips:
- Use tables for structure, instead of CSS.
- Nested tables are more reliable than padding and margins.
- Avoid CSS shorthand. (Use full definitions.)
- Don’t use PNG images because Lotus Notes 6 and 7 do not show them.
- Explicitly set a margin for every paragraph, because the defaults vary a lot.
Read the “Rock Solid HTML Emails” article for all of the tips and follow-up comments. Your next step should be to bookmark the following links and save a bunch of time (and maybe your hairline, too).
HTML email templates and design galleries:
Campaign Monitor’s research on HTML rendering in email clients:
Testing tools:
When you’re sick of dealing with problems…
Everything else…
- 42 HTML Email Design Resources
A summary of the best HTML email design resources, covering overviews, guidelines, standards, templates, checklists, design tools, galleries and more.
Planning for Email Newsletters
We’ve covered some of the big design and technical factors that make HTML email a unique challenge, and this might be all you need.
Designing is not about lumping together HTML, CSS and a few images, though. It’s about solving problems, and email newsletters require planning, just like websites. Building an email is technically tricky but not impossible.
Building a newsletter that actually achieves its purpose is a different thing entirely. Your client (or boss) is paying you not so much to “design” as to help them sell more products, get more donations or win back clients.
If you don’t understand what an email is for, you won’t be able to give it the best design, unless it’s by accident. Here are a few questions to ask your client before putting mouse to pixel.
- Who are you sending these emails to?
- What is your main reason for sending these emails? (To drive sales? Build a relationship with subscribers? Start conversations?)
- What type of emails are you planning to send?
- What type of content do you want to send?
- How often do you want to send emails?
- Would you like to match the emails to an existing visual design?
- Do you have examples of other emails that you like?
With answers in hand, you can set some measurable goals. One measurable goal might be to “Get 10% of subscribers to click through to the sales page,” or “Get the email forwarded to at least 100 new people this month.”
Keeping these goals at the front of your mind as you layout the newsletter changes the way you design. Suddenly you have something to help prioritize the content and a standard for deciding what stays in and what’s left out.
The work really begins once you actually send the email and can start measuring results against previous efforts.
Measuring the Success of Your Newsletter
Once you’ve set one or more goals, you’ll need to set up tools and processes to determine whether those goals have been met.
These might include sales figures from a particular department, reports from your email service provider or analytics from the website. If you use a specialized email sending service (such as Campaign Monitor, which is the one I use), you’ll get plenty of information in your reports.
Some common metrics:
- Open rates = How many of those who received your email actually read it.
- Click rates = How many of those who opened the email clicked a link.
- Forwards = If your software has a “Send to friend” function, you can see how many people used it.
- Unsubscribes = How many people have unsubscribed from your newsletter.
- Conversion rate = How many of those who clicked through to your website went on to buy your product, download a trial or perform some other trackable action. Software such as Google Analytics can be used to record such actions and connect them to their source, including if it was your email campaign.
Statistics from one campaign are hard to interpret. For example, what is a good click-through rate for your particular audience? That’s very hard to know. When you send your next newsletter out to that same audience, you’ll have something to compare it to, and you’ll know whether you’re getting better.
You can use those statistics and metrics to persuade your client to listen to your proposals. If a picture is worth a thousand words, then a graph showing a solid climb in click-through rates is worth at least 3,000 words and a cup of coffee.
Make a change, test the result, make another change and then test again. If your software supports A/B testing, then you can easily compare two subject lines or pieces of content in a single campaign and save yourself a lot of time.
Learn More About Email Marketing
Once you have the newsletter down, you may be interested in learning more about how email marketing works. Adding email marketing as a service to your own Web design business or freelancing skill set could really pay off. Convincing clients to pay a fair rate for design can be tough, but email marketing is much more easily measurable. If you can show your client that they are making x amount of money from each email, charging them accordingly isn’t so hard.
Here are some of my favorite email marketing websites to get you started:
Instant Inspiration For Your Email Campaigns
Here are just a few top-class HTML email designs, selected from the Campaign Monitor customer gallery and other sources. Use these to spark your own ideas; but remember, they belong to the original designers and clients and so are not for copying. Click each image to view the gallery entry and full email. Please notice that some of the designs featured below were selected not by the authors of this article, but by the Smashing Editorial team.































Get Out There And Do It
The next time your client asks you to design an email newsletter, you’ll have all the tools required to do a great job. Even if you don’t personally like HTML email, you’ll be in a position to give every one of their subscribers a helpful and readable newsletter.
Either we step up and get it done or the marketing team, armed with a CD of 10,000 clip-art images, will do the job for us… and we all know how that ends up. If you have any questions or comments, leave a comment below; I’ll address as many as I can.
(al)
© Mathew Patterson for Smashing Magazine, 2010. | Permalink | 81 comments | Add to del.icio.us | Digg this | Stumble on StumbleUpon! | Tweet it! | Submit to Reddit | Forum Smashing Magazine
Post tags:
-
Posted: January 19th, 2010, 6:30am EST
After news about the landing of US Airways 1549 in the Hudson first broke on Twitter in January 2009, the microblogging service quickly captured the imagination of a new group of potential users. Throughout the first months of 2009, tweetmeme_url = 'http://www.readwriteweb.com/archives/twitters_growth_slows_down_dramatically.php';tweetmeme_source = 'rww';digg_url = 'http://digg.com/tech_news/Twitter_s_Growth_Slows_Dramatically';digg_bgcolor = '#ffffff';digg_skin = 'normal';Twitter grew at a rapid pace, peaking at a growth rate of 13% in March 2009.
Now, however, according to the latest data from HubSpot, Twitter's growth is slowing dramatically. In October 2009, Twitter's growth rate had fallen to 3.5%. On a positive note, though, the average active user on Twitter today is more engaged than six months ago.
Sponsor


Most Twitter users, however - even if they are now more engaged on average - still have fewer than 100 followers. Only 18% of all Twitter users have more than 100 followers. A total of 81% of all users are currently also following less than 100 people. Just six months ago, the average user was just following around 40 accounts.

HubSpot's analysis also shows that more Twitter users now include bios (54%), links (65%) and location data (41%) in their profiles.
International Footprint Increases
As we pointed out earlier this month, social media analytics firm Sysomos also noted that most of Twitter's growth is currently happening internationally. According to HubSpot's analysis of over 5 million Twitter accounts, 40% of the top 20 Twitter locations are now outside of North America. In July 2009, only 15% were from outside North America.
For Twitter, this means that its current user base is making better use of the service, but the company also has to worry that its growth is slowing down. Maybe some of the earlier high growth rates were inflated by spam accounts, but a 3.5% growth rate is very low and the overall trend is only pointing down at this time.
Discuss


-
-
-
We've got some more details on Sony's beefed-up VAIO Z series of laptops which were announced at CES, namely the addition of Quad SSD drives, Intel Core i7-620M processors and NVIDIA GeForce GT 330M chips.
We already knew the two models would have a 13.1-inch LED backlit screen, an optical Blu-ray drive and HDMI-out, but new information is always appreciated. Made from carbon fibre and aluminum, the laptops weigh less than 1.45kg.
Going back to those Quad SSD drives, you'll be capable of writing data in parallel on up to four SSDs at 6.2 times faster speeds than usual.
Two models are available for pre-ordering now, the VAIO VPCZ11Z9E and VAIO VPCZ11X9E. The main differences between the two are that the Z9E has a 2.66GHz chip but can handle an upgrade to 3.33GHz, has 6GB of DDR3 SDRAM and the Quad SSD has 256GB of storage. The 13.1-inch display is 1920 x 1080 and it weighs 1.43kg.
The X9E has a 2.4GHz chip with upgrades to 2.93GHz, and 4GB DDR3 SDRAM with 128GB Quad SSD. The 13.1-inch screen isn't quite full HD, at 1600 x 900. It weighs a shade less than the Z9E, at 1.41kg.
Both VAIO Z models will be on sale at the end of March, with prices starting at around $1,000.
-
-
-
Measuring 6cm x 6cm, VIA's EPIA-T700 is the first chip launched in the new Mobile-ITX series which is actually the smallest computer-on-module available, even 50 per cent smaller than VIA's small-sounding Pico-ITX. That sounds, err, small.
VP of VIA Embedded Platform Division, Daniel Wu, claims:
"The VIA EPIA-T700 takes advantage of the modular design principles inherent in our Mobile-ITX form factor specification, making it easier than ever before to create astonishingly compact x86 devices that don't compromise on features"
The EPIA-T700 will primarily be used in medical, miltary and in-vehicle devices. Carrier boards are joined up with 3mm connectors, and is powwered by a 1GHz VIA Eden ULV processor and VIA VX820 MSP. There's 512MB of DDR2 RAM, a Chrome9 DX9 graphics core, Chromotion video engine that supports MPEG-2, MPEG-4, WMV9 and VC1video format. It also supports eight HD audio channels with the VIA Vinyl HD Audio technology. It can be connected to TTL LCD and CRT monitors thanks to the multi-configuration transmitter, and also compatible with PCI Express and Ultra DMA.
-
-
-
Posted: January 19th, 2010, 2:15am EST
If you're hoping to go to Twitter's first-ever developers conference, Chirp, you might like to know when it's scheduled for, right? Twitter hasn't publicly announced the date, but we wanted to know so that we didn't schedule our next public event on the same date. So I just asked on Quora, the new Q&A service just launched by Facebook's first CTO, Adam D'Angelo.
tweetmeme_url = 'http://www.readwriteweb.com/archives/is_twitters_first_conference_coming_april_14th_twi.php';
tweetmeme_source = 'rww';
Within a few hours I got an answer, from Ashton Kutcher, the most-followed person in the world on Twitter. Ashton says the event is going to happen on April 14. So our event will not be on April 14.
Sponsor


It's possible that the Twitter event is not actually going to be held on April 14, but I strongly suspect that is in fact the plan. As Twitter's number one guy, as the founder of a high-profile social media marketing company hanging out on a reputation-based site, as someone whose answer got a thumbs up from Quora engineer Kevin Der (who has a strong interest in the site being filled with accurate info) - it seems highly likely that Kutcher knows and is telling the truth.
Quora is a very compelling site, disproportionately filled with Silicon Valley engineering and investing elites talking comfortably among themselves for now. That's unlikely to last (especially if people start blogging about what gets talked about there!) but the site's user experience and design are more than good enough to hold their own long after the cool kids aren't alone there anymore.
Quora is subject of another article, still forthcoming. (Here's screenshots if you don't have an invite.)
For now, just make a note: Twitter's first public event is probably going to be held on April 14. That's what Ashton Kutcher says, anyway.
Discuss


-
Posted: January 19th, 2010, 1:45am EST
After AT&T and Verizon announced new mobile rates this past weekend, many users were happy to hear that the cost of voice calls would be reduced for two major American carriers.
Today, the restructured mobile plans and packages went into effect, but the costs, benefits and tweetmeme_url = 'http://www.readwriteweb.com/archives/with_new_mobile_rates_there_are_now_10_million_way.php';tweetmeme_source = 'rww';corporate revenues aren't as simple as a few saved dollars for cell phone calls. In a word, what all gadget geeks, tech-heads and mobile users know is that data is one of the more costly - and ever more popular - aspects of any user's mobile plan. As smartphone adoption increases, how do major carriers' plans stack up to one another?
Sponsor

Our good friend (and startup BillShrink rep) Tony Adam wrote today in a blog post, "The real truth behind the story is that the profits are in the data: Verizon's revenue is now up 24% (they reported $15.8 billion in Q309), with 17% coming from data services."
To put it bluntly, we're all texting, emailing, tweeting and updating constantly - who even has time for a phone call these days? The laws of supply and demand state that as demand for voice services wanes and the public consumption of mobile data services rises, corporations will realize that it's worth their while to create a false economic incentive for voice packages while maintaining and increasing rates for data packages.
The tricky part, then, becomes stripping away the marketing-ese, the convoluted packaging structures and the hard-pitch sales routines that go along with them to determine how users can get the best fitting data and voice plans.
Thanks to BillShrink's unwavering focus (and they said the process behind this achievement was "painful... the carriers didn't make it easy"), we have a concise, clear infographic on how mobile plans and rates from Verizon, AT&T, Sprint and T-Mobile all measure up to one another. Or at least we have a start: Based on data they collected, the BillShrink folks estimate there are now 10 million ways to structure a cell phone plan.

To see the full-size, fully detailed infographic, check out BillShrink's large version.
For example, Verizon and Sprint are currently asking $119 for unlimited voice, text and smartphone data plans, while T-Mobile and Sprint's equivalents ring in at $20 less per month. In fact, just about all the plans from these four carriers are identical until you start to factor in text messaging and mobile Web browsing, at which point Verizon and AT&T start to charge more than their competitors.
As smartphones and superphones take over the market, do you think we'll see more network-agnostic devices? And with more network-agnostic smartphones sucking up more mobile 3G bandwidth, do you think all carriers will raise their pricing for data and text packages?
Let us know what you think in the comments.
Discuss


-
-
Proving once again that there are no qualifications needed to be a middle-school vice-principal besides being kind of a dick, a San Diego veepee called the bomb squad to investigate an 11-year-old's Gatorade-bottle-based science experiment. Stay classy, San Diego.
Apparently the kid, who sounds like a bit of a prodigy, really, brought in a homemade motion detector made of empty Gatorade bottles and "some electronics." Cool, right? Shows initiative, and it even recycles old bottles! This kid should be rewarded with a blue ribbon, or allowed to star in a remake of Real Genius! But no.
Instead, this alarmist puritan called the bomb squad to investigate and x-ray the kid's science project, evacuate the entire school, and search the kid's home. When the project was found to not, in fact, be a Gatorade-bottle-based explosive, the a-hole vice-principal didn't apologize, or resign, or laugh it off. No! He recommended that the student and his parents seek counseling. For making a project that would totally stump me! And I'm twice his age! Outrageous, I say. Out. Rage. Ous. [SignOn San Diego via Boing Boing]
-
-
The hand-built Slayer espresso machine is not brandspankinew, but it is still exceedingly uncommon—fewer than 20 exist in coffee shops—and this one, residing at freshly opened RBC NYC, is the first east of Michigan. It costs $18,000.
The reason coffee nerds are hyped about the Slayer isn't just because it's obscenely expensive, or because of the way wood meshes with contoured metal to create a hulking, beautiful gadget, but mostly because of the way it allows a barista to easily play with pressure to do some interesting things—like start with a low pressure extraction, ramp up to full pressure, then back it down to get different textures or flavors—using the wooden paddles on top of the groupheads that adjust the mechanical valves which control water flow, which is what's unique about the machine. (More on the Slayer and pressure here, and more of our own espresso coverage and explainers here and here.)
gawkerGallery(5451424,12,'');
It's somewhat finicky, and different from other espresso machines that RBC's director of coffee (yes, that's her title) said it took her two months to really master the machine. Interestingly, they're testing out using the Slayer to do brewed coffee, to create something really different, but they're not sure when they're gonna offer it up. For now though, they're pulling some of the best espresso shots in New York, at least judging by the two drinks I've had. [Slayer, RBC NYC, Full-Size Photos]
-
-
Posted: January 19th, 2010, 11:15pm EST
According to WordPress founder Matt Mullenweg, the poll and survey Web service PollDaddy has just hit the 1 billion monthly page views mark.
This makes the PollDaddy network the second Automattic web property - excluding Gravatar - to reach this milestone. Automattic's holdings include content management system and blogging software WordPress.com, spam blocker Akismet and more.
Sponsor

In this graph from Quantcast, we can see monthly impressions sliding from around 500 million in August 2009 to 1 billion now:
PollDaddy's traffic, according to Quantcast, also shows a decent breakdown of regulars frequenting the site:
Our sources tell us a major redesign is underway, one that will make using the service more intuitive for end users and will promote the use of surveys.
Moreover, users of the company's WordPress.org plugin will now be able to add PollDaddy's rating feature. This feature allows users to place ratings on their blog posts, pages and comments, like so:
Mullenweg writes, "Watch for some other major updates coming up soon." As frequent users of PollDaddy on this platform, he can be sure we'll keep an eye out for news about this service.
In honor of this momentous traffic milestone, we present you this commemorative poll, powered by PollDaddy:
What other Automattic Web property has achieved one billion monthly pageviews?(survey)
Discuss


-
-
Posted: January 18th, 2010, 10:30pm EST by CNET
AT&T has fixed several problems that caused some AT&T customers to log into the wrong Facebook account when using their mobile phones, an AT&T spokesman said on Monday: "In a limited number of instances, a server software connectivity error resulted in some AT&T wireless customers being logged in to the wrong Facebook account when they accessed Facebook through their mobile phones."
AT&T added new security measures to prevent the problem from happening again and worked with Facebook to disable subscriber identification information as an option for automatic log-on, Coe said. The subscriber identification is the session identification number that gets added to the URL, he said.
AT&T also fixed a separate problem in which a customer in Atlanta was able to log into the wrong Facebook account on a mobile phone. In that "isolated" case, the problem was due to a misdirected cookie on the customer's phone, Coe said.
"We worked with the customer to resolve the issue," he said. "It is unclear how this cookie was set on the phone."
Asked for comment, a Facebook spokesman said: "We don't have anything more than what AT&T is saying."
The Associated press first reported on the problems this weekend.
This story originally appeared on CNET
-
Posted: January 18th, 2010, 10:00pm EST
Today, Americans are celebrating a very somber but inspiring national holiday: Martin Luther King, Jr. Day.
As Twitter co-founder Biz Stone wrote in a blog post a few days ago, "People all over the United States are urged to honor Dr. King's legacy by making this holiday a national day of service." Stone reminded us of this wonderful quotation by King: "Life's most persistent and urgent question is: What are you doing for others?" tweetmeme_url = 'http://www.readwriteweb.com/archives/open_thread_how_are_your_social_media_causes_actua.php';tweetmeme_source = 'rww';
But often in my sojourn through the social Web, I find myself with no decent answer for that question as I watch hordes of well-meaning people throw their supposed social capital at hashtags and fan pages without doing anything more meaningful than that. What do you think: Is your "whuffie" enough of a donation to a good cause?
Sponsor

"What are you doing?" "What's going on?" The questions most often asked of us by the social Web are essentially navel-gazing. In a recent post about a startup devoted to self-reference, I wrote, "Answering questions all about you, your preferences, your past, your thoughts, your wishes and hopes, your regrets, what you eat and where you live - nothing is more intoxicating to the average social media user. From our first LiveJournal entries to mid-2000s MySpace chain surveys to our latest tweets, we clearly love talking about ourselves."
If the visibility of humanitarian topics in social media is any indication of a trend, we clearly love aligning ourselves with good causes, as well. Sometimes, it seems to me that the latest global tragedy or incurable disease is used as simply another hue on the social Web's palette - something we use to paint pictures of ourselves.
For example, in 2009, I saw waves of green Twitter avatars and locations of "Tehran" as #iranelection peaked on Twitter's trending topics. But what did any of us actually do to help the citizens on the ground there? The green pro-free Iran icons really did nothing to help the folks getting wounded and killed in Iran. And the new "censored" Twitter avatars we're seeing? Well, since Twitter's blocked in most countries that are aggressively censoring Web content, it does absolutely no good.
As Kiva fellow and social media philanthropist Sloane Berrent told me a few months ago, "People are so fast to click a button, and that can be great. Retweeting, forwarding and Facebook walls are great engagements. But what's more difficult is the donate button. That's the big hurdle and disconnect."
In other words, from Haitians to humanitarians, they all wish we'd put our money where our mouths (or status updates) are.
Our latest international disaster was Haiti's earthquake last week. I'm sure many of the folks reading this post did a lot to help via donations to the Red Cross and other organizations, but how often can we say that our social media or other actions are truly doing something for others? And how often are those actions as ineffective as a lapel pin on a politician or as meaningless as a prayer on the lips of a hypocrite? In many cases, the social media user is doing nothing for others, but is instead highlighting his own awareness and sociopolitical "involvement."
There are some organizations such as SocialVibe (scroll to the last part of the post) or Drew Olanoff's Blame Drew's Cancer campaign that allow brands to foot the bill for fundraising as users simply point and click their way through Web interfaces to show their support. And there's no doubt that social media tools have made it easier for struggling groups to communicate their needs for help. But by and large, I believe that our social media actions don't do nearly as much for others as they do for us ourselves.
Perhaps, before we fire off rant-replete blog posts or make our avatars into 50 x 50 pixel political statements, we should ask ourselves the question Dr. King posed so many years ago: "What does my action DO for others?" And on the flip side of that coin, "What does my action do for me?"
If the answers to those questions embarrass you, take a step back, make a sizeable donation to a related humanitarian organization, then post away and tell others how much you donated and to whom, and create channels for others to do the same.
What do you think? Am I completely wrong; is awareness and communication through social media the "new" currency for donating to a good cause? What points have I missed in my thought process? Let me know your opinions in the comments, and also share how you plan to make your actions count for others today.
For another perspective on this topic, see Mashable editor Ben Parr's column on CNN.com, or check out ReadWriteWeb's Charity & Social Good archives.
Discuss


-
Posted: January 18th, 2010, 8:52pm EST
-
Posted: January 18th, 2010, 6:01pm EST
Before moving to the Valley I thought stock was something you made by simmering meat and vegetables in a pot of boiling water. To this day I'm still no expert in negotiating for equity, but I recognize a great resource when I see one. Fansnap co-founder and investor Andrew Payne recently wrote an article entitled, Startup Equity for Employees. Payne offers a stock cheat sheet and some useful points to consider.
Sponsor

Options & Vesting:You generally don't get your stock right away and most companies grant you an "option" to purchase stock over time at a fixed strike rate. This time period is your vesting period and your strike rate is the price of purchase. As the company goes through changes Payne advises employees to pay attention to how their strike rates increase and renegotiate accordingly. Higher strike rates may mean that employees will be less capable of exercising all of their options.
Outstanding Shares: Says Payne, "a share number is meaningless without knowing the total number of shares outstanding." As an employee, you should figure out what percentage of the company you own based on the number of shares that exist.
Preferred Stock: Writes Payne,"Common stockholders should care about the preference, because that preference is ahead of the commons in any acquisition outcome." Unless you've invested a significant amount of money in your company, you likely have common stock. In the event of an acquisition, preferred stock holders such as investors and founder/investors get paid out on their investments first before common stock holders earn any money. Once you get the total preference number for the company, you can roughly calculate how much you're likely to make or not make in the event of an acquisition.
Dilution: Companies raise new money by creating and selling new shares. The number of outstanding shares then increase and your shares are diluted and reduce in value. While many companies grant additional stock to employees, according to Payne, it's rarely enough to compensate. He advises you to, "negotiate for the largest equity portion you can, because that initial grant is going to be the bulk of your ownership and will get diluted down from there."
Incentive Stock Option Pool: Find out the size of the ISO pool and how much stock has been allotted to employees until the next round of funding. Without a decent stock incentive, you may find your company hiring only the lackluster employees who'll accept a less-than-generous offer.
For Payne's complete article visit Payne.org and for more advice check out Salary.com. Once you've read these articles you should have enough information to consult with your lawyer and accountant.
If you've got more resources to suggest, let us know in the comments below.
Discuss


-
Posted: January 18th, 2010, 4:30pm EST
When New Zealand-based entrepreneur Rod Drury began researching his market he could hardly believe what he was seeing. As seen in Drury's comments last week on the state of the online finance ecosystem, only a handful of players like Saasu and MYOB were targeting small business clients. While Drury saw that a number of cloud-based personal finance companies like Mint were gaining traction with users, small businesses had been stuck with the same tired desktop accounting software they'd been using for the last ten years. Drury built Xero with the intent to help small businesses manage their accounts in the cloud.
Sponsor

RWW's Online Finance Series:
- How the Web is Transforming Personal Finance
- The Evolving Online Finance Ecosystem
- Startup Finance: Xero Powers Accounting in the Cloud
When asked why the cloud is so important for accounting services he explains, "In the past small businesses rarely shared their business data with accountants as the majority of billable hours were spent simply extracting the right information." Says Drury, "The fact that your entire business can now look at your accounts in the cloud means that the accountant can finally act as a business advisor and improve your cash flow."
Xero also works with a number of banking institutions. This means that rather than waiting 5 business days for a bank to reconcile your accounts, they're up-to-date with your daily transactions.
There are currently 12,000 companies working with Xero (including ReadWriteWeb) and the company recently launched integration with invoicing service FreshBooks and CRM-tool Salesforce. For between $19-39 dollars per month startups can access their accounts from anywhere and reduce the anxiety around the accounts payable and receivable process. To try it for yourself visit xero.com.
Editor's note: This story is part of ReadWriteWeb's Online Finance series, a weekly, three-month long look at how the Internet has transformed finance. Up until April 15, the deadline for U.S. readers to file their taxes, we'll be looking at how finance software has evolved, analyzing top web tools and posting video of our conversations with the people who are shaping online finance. If you are interested in sponsoring the rest of this Content Series, please contact our COO Sean Ammirati.
Discuss


-
Posted: January 18th, 2010, 4:02pm EST
Looking at data from the third quarter of 2009, content delivery network Akamai just announced that the average broadband speed in the U.S. declined by 2.4% in the third quarter of 2009 compared to the same quarter in 2008. tweetmeme_url = 'http://www.readwriteweb.com/archives/broadband_speeds_around_the_world.php';tweetmeme_source = 'rww';digg_url = 'http://digg.com/tech_news/Broadband_Speeds_Increase_Around_the_World_Not_in_the_US';digg_bgcolor = '#ffffff';digg_skin = 'normal';
In the U.S., Delaware currently leads with 7.2 Mbps, though it remains far behind South Korea, where the average speed is almost 15 Mpbs. Currently, the U.S. is in 18th place, far behind Japan, Hong Kong, Romania and Sweden. The average U.S. broadband speed is currently 3.9 Mbps.
Sponsor

If you are looking for a fast Internet connection in the U.S., Sandy, UT and Iowa City currently offer the fastest connections. Delaware (7.2 Mbps), New Hampshire (5.9 Mbps) and Massachusetts (5.9 Mbps) are the top 3 states on Akamai's list. The states with the fastest average broadband speeds can all be found on the East Coast.
It is interesting to speculate why average speed in the U.S. declined over the last year. Chances are that a lot of people downsized their connections during the economic downturn. If you have a theory, let us know in the comments.

IP Addresses: U.S. Leads but China is Catching Up
Akamai's quarterly report also notes that the number of unique IP addresses increased by about 4.5% globally since the second quarter of 2009. The U.S. is still home to the largest number of unique IP addresses, but China is catching up quickly. In total, the U.S. was home to just over 119 million unique IP addresses in Q3 2009.
With 49 million IP addresses, China is currently a distant second, but the number of Chinese IP addresses increased by 30% compared to Q2 2009, while U.S. addresses on increased by 9%.
Attack Traffic
Akamai also looked at where most of the traffic from botnets and other attack traffic originated from. Russia (13%) is currently the source of most of this traffic, followed by Brazil (8.6%) and the U.S. (6.9%). On a positive note, it's important to note that attack traffic from the U.S. declined from 15% compared to Q2 2009. Attack traffic from China declined even more. In Q2 2009, 31% of all of this traffic originated in China. Now, China is only responsible for about 6.5% of all attack traffic.
Most of these attacks (78%) target port 445. On Windows systems, port 445 handles local printer and file sharing traffic.

Discuss


-
Posted: January 18th, 2010, 2:31pm EST
Equal parts jewelry and gadget, the new Jawbone Icon ($100) continues the Bluetooth accessory specialist's push to make headset wearing less of a social faux pas. In addition to gallery-worthy...
Visit
Uncrate for the full post.
-
Posted: January 18th, 2010, 1:29pm EST
In need of a Blu-ray player and receiver, and don't want to buy an extra box *cough* PS3 *cough* to get both? The Denon S-5BD Blu-ray Player/Receiver ($1,800) has you...
Visit
Uncrate for the full post.
-
Posted: January 18th, 2010, 11:25am EST
Add a touch of old-world elegance to your winter wardrobe with the Billykirk English Walker Hat ($110). Made from 100% wool, this simple, refined cap features a traditional English country...
Visit
Uncrate for the full post.
-
Posted: January 18th, 2010, 11:08am EST
It's not often we get to cover a concept vehicle that actually makes it to market, but that's exactly the case with the 2011 Honda CR-Z ($TBA; Late Summer 2010)....
Visit
Uncrate for the full post.
-
Posted: January 18th, 2010, 10:28am EST
Watch the story of The Dude — or The Knave, as it were — like never before in The Two Gentlemen of Lebowski. Running on Thursday - Sunday, March 18th...
Visit
Uncrate for the full post.
-
-
This week we rounded up the best DVD ripping tools, explained why your passwords aren't as secure as you may think (and helped you fix that), and showed you what your email address says about you.
- Five Best DVD-Ripping Tools
You pay good money for your DVDs, but they're hardly the only format you need these days. These five ripping tools ensure you can back them up, keep them on your media server, and load them on your favorite portable player.
- Your Passwords Aren't As Secure As You Think; Here's How to Fix That
If you allow applications to save your passwords, anyone with physical access to your PC can decode them unless you're properly encrypting them—and chances are pretty good you're not. Let's walk through the right and wrong ways to store your passwords.
- Pack a Gun to Protect Valuables from Airline Theft or Loss
If you don't like your bags being out of your sight and it makes you uncomfortable to think that airline workers are rifling through your stuff, you can take advantage of the TSA's own security rules by—eek—packing a gun.
- Top 10 Winter Survival Tools and Tactics
No matter how many times we go through it, winter always seems to catch us by surprise—a chilly, costly, inconvenient surprise. Prepare yourself for the rest of this season with helpful and healthy projects, clever tricks, and energy savers.
- The Definitive Guide to Making the Most of Your Netbook
Netbooks are a great compromise between pecking away a smartphone keyboard or hauling a tank-size laptop around—but they aren't without shortcomings. Make the most of your netbook with these netbook-friendly tips, tricks, and applications.
- Android 2.1's Best Features in Screenshots
The new Nexus One is a sleek, awesome handset, but the most important ingredient in touchscreen smartphones is software. The screen is just a canvas that software paints on, and Android 2.1 is a work of art.
- From the Tips Box: Smartphone Speakers, Wallet Holes, and Fire Starting
Readers offer their best tips for making your smartphone's built-in speakers louder, preventing your wallet from burning a hole in your jeans, and starting a fire without fancy tools or logs.
- Make the Most of Chrome with These 13 Excellent Extensions
Shortly after Google Chrome's Extensions gallery opened, we rounded up 18 worthy downloads. Now that Chrome's official add-on market has matured a bit, we've dug up more productive, annoyance-fixing, feature-adding extensions that you should consider adding to your collection.
- WebMii Shows You How the Web Sees You
These days performing a vanity search of your own name isn't just about vanity, it's good to know how future employers and dates that Google-stalk you will see you. WebMii can help you get a picture of your online image.
- Internet Survival Guide for Traveling Where Privacy Isn't Respected
Ed. note: On Tuesday, Google responded to cyber attacks aimed at Chinese human-rights activists by ending search-result censorship in China. An anonymous reader with experience living where privacy isn't respected writes in with tips for keeping your data safe in these situations.
- How Do I Automatically Shut Down My Computer at a Certain Time?
Dear Lifehacker, I like to watch TV on my computer at night but sometimes I fall asleep before the program ends. How can I set my computer to shut down at a certain time or after it finishes specific events?
- Know What Your Email Address Says About You
Earlier this week we asked you what your email prejudices were. We dug through the comments, and now we're back to highlight how you feel about certain email addresses and what they say about the people who use them.
-
Posted: January 15th, 2010, 10:12am EST
Forget KFC — make your own restaurant-quality fried chicken at home using the Ad Hoc Fried Chicken Kit ($15). Based on the same recipe and preparation used in Thomas Keller's...
Visit
Uncrate for the full post.
-
Posted: January 15th, 2010, 10:10am EST
If you're the type of guy that needs more speakers in his headphones than most people have in their home theater setups, Ultimate Ears 18 Pro Custom Monitors ($1,350) are...
Visit
Uncrate for the full post.
-
Posted: January 15th, 2010, 9:39am EST
Live in the L.A. area and have an affinity for all things He-Man? Then get over to Gallery 1988 before January 29th for Under The Influence: He-Man & The Masters...
Visit
Uncrate for the full post.
-
Posted: January 15th, 2010, 8:50am EST
Ultra-thin with a price that puts it in decidedly more premium territory than the company's previous point-and-shoots, the Kodak Slice Touchscreen Camera ($350) isn't just Kodak's most ambitious pocket cam...
Visit
Uncrate for the full post.
-
Posted: January 15th, 2010, 7:07am EST
You can buy all the screws, bolts, and power tools you want, but no toolbox is complete without a bottle opener to help you get through the job. The Cast...
Visit
Uncrate for the full post.
-
-
-
Posted: January 14th, 2010, 3:31pm EST
With hardcore industrial looks, a sturdy matte steel body, and mammoth 50mm face, the Welder K24 Watch ($1,350) is great for the man that wants to wear his watch anywhere...
Visit
Uncrate for the full post.
-
This week we showed you the best times of the year to buy new gear, offered a few suggestions for keeping your PC in better shape in 2010, and highlighted a tool to help you off your online identity.
- The Best Times to Buy Anything, All Year Round
You're always hearing about off-season, post-peak times to save money on purchases and food, but it always arrives too late. We've compiled a timeline and lots of best-time-to-buy suggestions into one post to help you plan a more frugal 2010.
- Current Crop of Smartphones: A Cost and Feature Comparison
Cost-comparison web site BillShrink hits it out of the park with a handy infographic comparing the cost and features of the current generation of smartphones: the Nexus One, the Palm Pre, the Motorola Droid, and the iPhone 3GS.
- Resolved: Keep Your PC Clean, Safe, and Backed Up in 2010
It's the start of a new decade, and while you're busy making resolutions for yourself, you shouldn't forget about your PC. We suggest making a resolution to keep your PC clean, safe, and backed up for 2010.
- Use Better Tools to Be a Better Student in 2010
Despite the proliferation of laptops and netbooks, the vast majority of students still use their computers like $500 typewriters. Stop working so hard and be a better student by leveraging some clever computer tools to your advantage.
- Top 10 Mind Hacks for Making Your Resolutions Stick
Nothing but the strength of your convictions can keep a self-improvement promise going for at least 365 days. You can, however, boost your chance at success and outwit your worst habits with some motivational devices and clever thinking.
- WineBottler Turns Windows Programs into Standalone OS X Applications
Mac only: Wine has always been popular among Linux users for running Windows programs, but Wine is available for Mac, too—and now, free utility WineBottler can "bottle" Windows programs into separate application bundles that run as standalone Mac apps.
- What's the Best Way to Share Files Across Multiple Home Computers?
Dear Lifehacker, We're a large family with several computers in our home. What's the best way to share files across our home network rather than putting them on thumb drives and running from PC to PC?
- How a $530 Nexus One Might Actually Make Sense
You've probably heard about Google's Nexus One launch today, with a cost of $180 with a two-year T-Mobile contract and—wait, $530 without? Actually, that math might make sense, as blogger Ben Ferguson shows in his cost breakdown.
- Web 2.0 Suicide Machine Offs Your Online Identity
Sure, joining Twitter and Facebook seemed like a good idea at the time, but maybe you've changed your mind and want your life back. Web 2.0 Suicide Machine erases your persona like you were never there.
- How to Survive a Job That Makes You Miserable
The economy being it what it is, jobs aren't exactly growing on trees. If you're stuck in one you hate, here are a few ideas to make it bearable until something better comes along.
-
We jokingly call it joining the Mile High Club, but the idea is that we're inviting people to test out in-flight Wi-Fi speeds while taking silly pictures of themselves.
The rules of the Mile High Club are simple: A goofy picture isn't mandatory to gain membership, but you do need to run a Speed Test while using in-flight Wi-Fi and send us the results. So either take a screenshot or copy the data and email it to me (along with any in-flight webcam pictures) under the subject line "Mile High Club." Please make sure that you also include the name of the airline you're flying (and, if possible, the cities you're flying to and from). Oh, and don't forget to grab coupon code for free inflight Wi-Fi before you go (some of those codes might still work).
In exchange for your email, you'll get no membership cards, no tshirts, no cookies, and no invitations to member-only events, but you will receive a "thank you" from me and be able to count yourself as part of our little club.


-
-
I don't know what's going on over at Samsung, but as PMPs die, you've got to come up with some way to differentiate your product—and I guess a see-through screen is as good a way as any.
Samsung's PMPs are among the best out there—I love the P3—but their design has been only slightly quirky in the past. All the crumbly gingerbread cookie widgets in the world wouldn't compare to the utter Korean weirdness going on in the IceTouch (which recalls the SE Pureness) and the MyFit.
The IceTouch is a 16GB player with a 2-inch AMOLED touchscreen, but what a freaking weird touchscreen it is. First, it looks like it has a sliding blue sheath of some kind that covers the touchscreen. Why? Who knwos? But Samsung didn't stop there—the screen is transparent. The player itself isn't made of plastic or metal, but tempered glass, and features Samsung's usual sound enhancements and top-of-its-class video compatibility. It also has (eep) a brand of Samsung's TouchWiz UI called Sweep. You might remember TouchWiz from when it thoughtlessly murdered any hope the Omnia II had. Samsung's PMPs have mostly escaped TouchWiz's sinister, all-reaching grasp, and hopefully the IceTouch survives as well.
Pricing and availability haven't been announced yet. [Samsung]
IceTouch 16GB Transparent AMOLED Touch-Screen MP3 Player
In addition to the full-color transparent AMOLED touch screen, the IceTouch features a high-performance CPU and Samsung's own "TouchWiz Sweep" interface, which is designed to provide a comfortable grip and give users new options for interacting with their player.
Audio purists will appreciate the device's new 5.1-channel sound enhancement technology and support for the MP3, WMA, OGG, FLAC, AAC, M4A, WAV and MP3HD audio codecs, and video hounds will love being able to playback MPEG4, WMV, H.264, Xvid and Divx files. The player also continually analyzes and adjusts audio levels to reflect the producer's intended sound.
The AMOLED screen casing is constructed using a dual-injection molding process and tempered glass and results in a smooth, durable and scratch-proof surface that is aesthetically pleasing and enjoyable to the touch. The IceTouch, which comes in white, can also be individually customized through separately sold color skins in pink, blue, purple and gray.


-
The MyFit is a pretty good idea taken unexpectedly to the extreme. A workout player, sure, that's a good idea. But wait, this doesn't just count calories, it measures your fat and forcibly tells you to drink water.
gawkerGallery(5440085,4,'');
The MyFit is an 8GB workout player, and while it likely won't be cheap or durable enough to displace the Sansa Clip+ as my workout player of choice, it's definitely more feature-packed. It has fat and stress sensors, a customizable exercise management program that selects music based on workout, calorie counter and jogging control—all great. But it also has a water intake manager to tell you when to take a water break, and something about "smoking cessation," presumably to yell at you for smoking. How does it know if you smoke? Who knows? As a PMP, it's got the usual attributes, including an FM radio and decent codec support. It'll be available sometime in the first half of 2010, and no price has yet been announced. [Samsung]
MyFit Wellness Promoting MP3 Player
As the world's first portable media player to integrate wellness management tools, such as stress and body fat levels and customized workout guides, MyFit helps users achieve wellness while enjoying their favorite music tracks. MyFit transcends basic playback of music and videos and enters the realm of wellness information and monitoring. Its unique features reflect the functional and stylistic nature of music enthusiasts while incorporating important applications and information for a fully-customizable device that encourages a healthy lifestyle. Music can be collected into a jogging playlist and a simple Tapping Control Jogging mode makes it easy to change to the next song without interrupting a workout.
Breaking ground with the world's first fat and stress sensors located on the top of the player, MyFit measures a user's wellness indicators and contains an exercise management program to keep people on target with their fitness goals. A built-in accelerometer automatically tracks calories burned while jogging, and users can record their caloric consumption per meal with the included food calorie database. Additional wellness applications built into the MyFit include a water intake manager and smoking cessation utility.
But more than helping to make consumers healthier, MyFit is a full-featured portable music player that features an FM radio tuner and Samsung's DNSe 3.0 sound enhancement technology, which helps to overcome the inefficiencies and limitations of compressed audio files and generate a more realistic stereo sound. Media playback includes high quality compressed and lossless audio formats, such as MP3, WMA, OGG, and AAC, as well as MPEG4 and WMV video formats.


-
My favorite books have something very special between their pages: Inscriptions and autographs. Unfortunately, that special quality can't be replicated with ebooks or readers. Not exactly, at least, but Danie Ware has an idea that might almost work.
Danie Ware, a PR gal for comic book store Forbidden Planet, describes her plan to capture the collectible nature of old-fashioned books with readers as follows:
Removable, collectable vinyl covers – plain, a selection of colours, maybe they can be stylised by your favourite art toy designer – but ultimately, they're there to collect signatures. Take one to a Convention, keep it on you, it protects your Kindle, it looks cool – and you get to show off all the autographs/sketches you've collected.
Clever idea, but then you're left with a shelf full of book covers and at that point you might consider collecting regular books again. It's a workable solution, but still not perfect. How will autograph collectors cope in the age of ebooks? Or will they just never make the jump from paper to e-ink? [Danie Ware via Futurismic]
Photo by UggBoy


-
-
Lenovo's IdeaPad U1 is quite the clever combination of multi-touch tablet and laptop. When you ditch everything but the screen for the slate-like tablet section, the device is to switch processors and operating systems. Oh, and it's gorgeous, too.
When both halves of the U1 are together, it runs on Windows 7 on a Intel Core 2 Duo SU processor, but when you split them up, the tablet will use a custom version of Linux and a Qualcomm ARM Snapdragon processor. This means that you'd be getting the best combination of power and battery life for each scenario. Other than that neat setup, the U1 brings 4GB of RAM (512MB in slate/tablet mode), two USB 2.0 ports, eSATA, VGA, HDMI, 4-in-1 memory card reader, and a 1.3-Megapixel camera.
Not too bad for about a thousand bucks. Lenovo will start selling the hybrid in June, but in the meantime I'll be left wondering if it is really the best of both worlds wrapped in a pretty package or yet another half-hearted combination device.
gawkerGallery(5440057,4,'');


-
Reddit commenter icallthebigspoon posted an ad on Craig's List trying to swap his camera for a usable AT&T phone. I sincerely doubt that he expected this offer, but he'd be one cruel man if he didn't take it.
Click on the image for a bigger version.
According to icallthebigspoon, he posted this simple, unremarkable Craig's List ad:
I have a pink Casio Elixim 7.2 Megapixel digital camera that needs a new battery and maybe a new charger as well. I am selling it for $30 OR I am willing to trade it for a useable cell phone that works on the ATT network. Email me if interested.
and received this response:
Hello,
I am very interested in trading with you. I have a barely used att i-phone that my ex-wife gave me. I don't like to use it because it reminds me of her ugly face. I also have a camera just like yours except that the screen is cracked (I have the battery and charger). I need a camera bad because I have a new girlfriend and she is hot and is willing to let me take pictures of her!!!!! Lets make a deal straight up?
There's no word on whether he made the trade yet, but how could he not when it would make the other man's life oh-so-much more fun? [Reddit]


-
-
-
Posted: January 4th, 2010, 5:57pm EST
While 2009 continued a downward trend as one of the worst recessions in U.S. history, the decline for venture-backed mergers and acquisitions has not been as severe as the dot-com bust in 2001 and 2002.
New figures from the National Venture Capital Association show that in the last quarter of 2009, M&A hit $7.8 billion, up from the previous year's mark of just over $2 billion. Overall, 2009's total of $12.6 billion could not match 2008's $13.6 billion total.
Sponsor

Mergers and acquisitions totaled over $68 billion in 2000, only to fall below $8 billion by 2002 following the bursting of the dot-com bubble. In contrast, 2007's M&A total of $29 billion has declined to just over $12 billion in 2009 - a much more smooth rate of decay which has begun to flatten out.
Mark Heesen, president of the NVCA, says they expect to see continued improvement throughout 2010. "Clearly, we have a long way to go towards a full recovery but we are encouraged by the increasing acquisition values and the number of companies that have filed a registration with the SEC to go public," he says.

A late boost in the fourth quarter of 2009 has helped startups from reliving the experiences from earlier in the decade, the largest of which came from Amazon's July purchase of Internet shoe seller Zappos for $930 million. This acquisition helped internet specific purchases climb to $2.2 billion in Q4 2009 - a near seven-fold increase from 2008's final quarter.
Discuss


-
-
Posted: January 4th, 2010, 5:40pm EST
Intranets are becoming a higher priority for organizations. Intranet teams are growing in size, and the best of them are embracing new trends such as mobile accessibility and social networking.
These are some of the findings from Jakob Nielsen's annual report on the top intranets for 2010. Companies that made the list this year include General Electric, Trend Micro Devices and Walmart.
Nielsen is recognized as one of the world's foremost usability experts. His findings appear solid, though it is apparent that Intranet development is just on the verge of becoming a central communication environment for enterprise collaboration.
Sponsor

This year, Nielsen says, top companies on the list had a median size of about 6,300 employees, which continues a year-to-year trend toward smaller businesses. He attributes it to the increase in availability of small-company-friendly intranet technology.
In addition, intranet teams are growing, up to 14 people, 27% higher than the average team size in 2006. This is not a big surprise. The need to develop the best possible internal communications environments now cuts across multiple platforms, ranging from the web to mobile devices. More resources are required to keep these platforms synced and accessible to the employees in the organization.
Mobile Intranet Sites
The best intranets had a separate mobile site for its employees. Of the companies polled, only 30% actually had a dedicated mobile site. Expect this to change in the year ahead. People are still getting to know how to use smart phones. It's still rare for companies to launch application environments for users, but at least one company did: an iPhone web app. Soon, though, users will expect to have access "anytime, anywhere," to their organization's network.
Social Features
The social Web is finding its way into intranets. Nielsen cites two trends:
- social features for employees as individuals
- workgroup support and other features that encourage work-related connections
He cites Walmart for its discussion and profile pages and Trend Micro's TrendSpace, which includes the capability for employees to create their own content. Trend Micro goes as far as offering an elaborate system of reward points that accrue to employees when they contribute to the intranet's community features.
It's noteworthy that social features are still just emerging in intranet environments, especially with the advent of enterprise collaboration services. Companies still have the chance to be recognized as innovators in this space, especially if they implement real-time update capabilities and mashup environments.
Intranet Design is Maturing
Overall, Nielsen comes to the conclusion that intranet design is maturing. In many respects, the Intranet has come of age.
In the year ahead, intranets will change even more. Mobile usability and social networking features will continue to evolve, especially as teams begin to experiment with the wide variety of enterprise collaboration services now available.
Discuss


-
Posted: January 4th, 2010, 4:52pm EST
"2009 was the year of Social Media" according to Buzz Study, the blog that keeps tabs on Infegy's Social Radar. They're not speaking from experience, they're speaking from what they've seen in the billions of "blog posts, news feeds, forums, social networks and Twitter posts" the service has collected over the past two years.
While the service normally provides more complex information around a certain brand, as in its tracking of the Domino's Pizza PR disaster this past September, the top 50 list takes an easier approach: how many unique sources mentioned a brand over the past year.
So what brand was the talk of the town in 2009?
Sponsor

Why, Twitter, of course.
Google, which had previously held the number one spot, took second prize and Facebook jumped up six spots to round out the top three.
While you can take a look at the full list of 50 top brands yourself, Buzz Study had this to say about the results:
The list certainly shows that 2009 was the year of Social Media. Twitter moved ahead of Google to take the number 1 spot, while Facebook and MySpace made significant leaps over big brands as well. Most video game related brands were down this year as well, including Sony, Wii, Xbox, and Nintendo. It also appears TV brands all jumped this year including Disney, MTV, Fox, BBC, CNN, ESPN, and ABC.
Blackberry, MTV and Starbucks were among the top movers in this years list, with each rising 17, 13 and 12 spots respectively. Canon, Samsung and Intel were the hardest hid on the list, dropping 17, 16 and 13 spots from last year.
Discuss


-
-
Posted: January 4th, 2010, 4:38pm EST
Since opening up shop in 1920, Eddie Bauer has made some of the best outdoor gear around, and the new Eddie Bauer Heritage Collection ($25-$700) celebrates that heritage with modern...
Visit
Uncrate for the full post.
-
-
-
Now the WSJ is quoting people "briefed by the company" as stating that the 10 or 11-inch Apple Tablet will be shipping in March for $1000, but will be announced at the January 27 event this month.
To familiarize yourself with the rumors so far, not including this one, head to our giant rumor page.
According to the WSJ, the tablet will be pretty much what we expected: movies, TV shows, games, browsing, books, textbooks and newspapers. WSJ also mentions two different material finishes for the tablet, and if we know Apple, they'll only have one; the two are just final prototypes so that Jobs can decide which one he likes more.
So it's good to hear that at least some of the rumored features might be delivered, but that $1000 price seems a bit high. Not high as in we think it's wrong, high as in cost-prohibitive-MacBook-Air-style high. [WSJ]


-
-
Liquid Image, known for attaching obtrusive cameras to adventure sport eyewear, has unveiled its surprisingly streamlined 335 Snow Camera Goggles. Using the goggles' built-in camera, you can now have certifiable video proof that you are a lousy skier.
The 335 Snow Camera Goggles, to be officially announced this week at CES, pack a 5 megapixel camera, capable of shooting 720 x 480 video. They only come with 16 MB of memory on board, but you can expand that with a Micro SD card to capture your entire snow plow down the mountain. The camera is activated by built-in controls on the side of the goggles, designed with big buttons for your chunky, gloved fingers.
More important than filming your skiing or snowboarding, however, might be the ability to film what you come across while you're skiing or snowboarding. A preliminary test of the goggles on the Ski Free mountain captured this rare shot of the Abominable Snowman:

You'll be able to record your turn on the slopes (and confirm the existence of cryptozoological creatures) by picking up the 335 Snow Camera Goggles for $149 sometime in July. [CNET]


-
Posted: January 4th, 2010, 3:39pm EST
Rarely do we post collections of academic essays, but rarely are they about The Dude. The Year's Work in Lebowski Studies ($17/Paperback; $53/Hardcover) is a collection of the best essays...
Visit
Uncrate for the full post.
-
-
Posted: January 4th, 2010, 3:22pm EST
ShoZu Goes to Critical Path - Cross Network Publishing Doesn't Seem to Be a Stand-Alone Business
Hours after high-profile Silicon Valley social aggregation service Seesmic announced that it acquired angel-backed cross-network publishing service Ping.fm, a similar deal was announced in Europe. Identity management service Critical Path, maker of software called Memova, announced that it has acquired mobile uploading service ShoZu, a company that had received an enormous amount of venture capital.
Sponsor

Rumors of the deal were first reported in mid-December by Robin Wauters of TechCrunch. Now the deal is done, reports leading European mobile blogger Ewan Spence. We're hearing that the announcement will be officially released later today. Update: We just received the official press release as well.
ShoZu raised more than $30 million to build a mobile app that allows users to publish photos, videos and text to more than 50 different destination social networks like Facebook, Twitter, Flickr, Blip.tv and more. The service has long been popular on Nokia phones and sells an iPhone app for $5. Shozu was voted one of our readers' favorite mobile apps in 2007. For more about ShoZu see this Techcraver interview with the company's CEO.
Critical Path is a little like a combination of Plaxo and Verisign. It offers messaging and social apps, APIs, Identity Management and Access Control.
Was this the big exit that ShoZu's investors sought? Almost definitely not. Critical Path is an innovative service that's got some big customers like BT, France Telecom and Orange, but it's unlikely that ShoZu came at a high price. Spence alludes to the same when he writes that Critical Path "saw the potential of combining their Memova platform suite with ShoZu's engineering." Update: In the official release, ShoZu Board Director Nigel Pilkington from lead investor SEB Venture Capital UK, called the deal "a successful outcome for us." Maybe that's being polite, maybe it's true or maybe it was a small success financially.
It's most likely a talent deal and evidence that cross-platform publishing tools like ShoZu, Ping.fm and competitor Pixel Pipe are probably not stand-alone businesses. Just like FriendFeed's aggregation across scores of APIs wasn't enough to make it a success outside of being scooped up by the much, much larger Facebook - these other companies that create the pipes for the tubes just aren't compelling enough to a large number of consumers.
They do make nice acquisition targets, though, and show that the future of the social web may not be found in reading and writing to one single network like Twitter or Facebook. The savvy companies that are building value on top of those networks are also dedicating resources to bring on engineers skilled at working with far more networks to publish to or read from.
Discuss


-
Bonooooooorrrrlllllllll! I know you are a rock star and a defender of the planet and I really like Joshua Tree and Rattle & Hum and even Zooropa, but come on, "reverse Robin Hood"? So wrong. And it gets worse:
"But we know from America's noble effort to stop child pornography, not to mention China's ignoble effort to suppress online dissent, that it's perfectly possible to track content."
Amazing. Is he putting the fight to protect children from sexual depredators at the same level of pirates copying music? Or does he wish that we all had an Internet control system comparable to communist China? And this guy fights for human rights and freedom?
At the end, Bono, this is not about reverse Robin Hooding. This is not about the providers stealing from you. This is about two groups of fat cats fighting for money. First, you're rich and your pals at the music industry are rich. Second, those are rich service providers. In the middle, getting sandwiched between your throbbing shameless practices and thick hypocrisy, is the people. I can't speak for the rest of us, but I'm sick of you both.
And while we are talking about Robin Hood, and giving gold schillings from the rich to the poor, let's talk about your tax evasion practices to avoid redistributing your wealth in Ireland. [BBC]


-
-
Maybe it's better that most of us don't remember every part of New Year's Eve (basically, from 5PM on). If you're suffering from alcohol-induced amnesia, here are 25 happier Shooting Challenge shots to fill the void.
The placements...
Second Runner Up

Nikon D40x on tripod. AF-S Nikkor 18-55mm stock DX lens; F6.3; 8 seconds; Color corrected in camera raw. Motive: Stockholm cityscape with city hall in center.
-Andreas Hellqvist
First Runner Up

The morning after. The image here is a stereographically projected panorama consisting of 90 separate exposures. As you see it's not complete, I had intended it to be 360° by 180°, however by the time I got to just over the houses, I lost all feeling in one of my fingers and decided to go have a pizza instead. This is also why my bag and parts of the tripod is visible on the ground; I couldn't grip the camera to shoot a straight-down shot. (Temperature at the time was somewhere around -20°C) Gear used: Canon EOS 450D camera, Canon EF 28mm f/1.8 USM lens at f/7.1 (I shot in apperture priority mode, so shutter times vary), Manfrotto 190xprob tripod with a 804RC2 three-way head. (For you who want to get started in shooting so called planet panoramas, this head is not a particularily good choice because it doesn't give you 180° freedom up and down, but you can flip the camera mount plate to put the entire camera "backwards" and so shoot straight up.) The images were converted from raw to 900x600 size jpegs and then stitched in Hugin. Incidentally, if you do the math you'll find that quite a few of the images are not overlapping by a whole lot which caused the autopano sift-c routine to misalign quite a lot of it. Total time to find control points to fit it all together was around four or five hours. To be fair, this is a failed picture, but it looks rather nice, so perhaps you'll enjoy it too. Next time I wait til it's a little warmer :-)
-Staffan Thomen
Winner

Photo taken on new year's eve. It's apparently underexposed (said my camera) with 1/2000s with my 5DmkII at ISO6400 with my trusted 50 mm lens at f/1.4. This is a handheld shot taken for fun with no clue what might turn out. I kinda like the sparks of iron flying. I increased the contrast and black levels in lightroom 3b to get rid of some of the noise.
-Øystein Alsaker
Thanks to everyone for entering. New Shooting Challenges are announced every Wednesday, and we need/appreciate your participation!
gawkerGallery(5439608,24,'');


-
Posted: January 4th, 2010, 2:37pm EST
Socialtext has announced record quarter-over-quarter bookings growth in 2009, bolstered by social computing's growing presence in the enterprise.
It's important to note that Socialtext is reporting record bookings, not record revenues. The company does not disclose its actual revenues. It's hard to to give Socilatext a lot of credit without knowing how its revenues fared. Further, the year ahead may be one of the most challenging for the company as competition is only getting more fierce.
Sponsor

Socialtext is one of the most established companies in the Enterprise 2.0 space, dating back to 2002 when it got its start as a wiki provider. In recent years, the company has diversified, adding a microblogging platform and collaborative tools such as SocialCalc, its collaborative spreadsheet application. Socialtext said it now has 6,500 customers, compared to 4,000 in 2008. The company also said it set a record for the number of companies that renewed contracts.
Jive Software may be one of the biggest competitors for Socialtext. Microsoft will be pushing hard into the enterprise market this year with Sharepoint 2010. Google, Cisco, IBM and a host of new players are also fighting for the same piece of the pie.
But, overall, the Soclaltext news is more real proof that social computing did get the attention of the enterprise in 2009, and that the year ahead should be another record year for the overall market.
Discuss