Issue 14 of Web Design Readings — Pay what the temperature is, customize Google map style, web design copy writing

Hi there,

This week we have links on special pricing model, SVG example, styling Google map and how to design your website by focus on copy writing first.

Styling google map with Snazzy Maps

We often need to include a map service in the web site. Next time when you add a google map in the contact page of your web project, you may customizing the styles to match the branding by using SnazzyMaps.

Pay what the temperature is

Yesterday I found a creative pricing strategy in a game license, which the price follows the value of real world temperature. In this snowman-theme game, you buy the game by paying what the real temperature is.

Pay what the temperature is

This reminds me the Pinboard bookmarking service that have a pricing related to the amount of users. The more users use the service, the higher price it will be. The more users use the system, the maintenance fee is higher.

Pinboard is not the only one. A Dropbox based writing service TextDrop follows similar pricing strategy too.

Pricing is market-based, increasing proportionally to the number of active accounts. Your yearly renewal price will be locked in when you sign up.
— TextDrop website

Start your web design in text editor

In Issue 5, I shared how we can design the website by going content-first.

Here are another 2 posts on this important topic by They are How to design better websites by writing them first and Loream ipsum has to die.

As the author Stefan Rössler said:

If designers simply use Lorem Ipsum instead of real information, they are not creating communication but only the framework in which it takes place.

Web design is about creating a communication between the site owner and the reader. In communication, you can’t avoid using words. Choosing and fine tuning the copy writings is very important yet often web designers forget it.

Jason Fried shares the same thought on “Since copywriting is interface design”:

Since copywriting is interface design, you can do an awful lot of great design in a text editor. Don’t worry about where things will go, or how they will fit. Worry about explaining it clearly and then build the rest of the interface around that explanation.

Still not convince? Here is another post that demonstrates how words play important role in web page.

A screenshot showing how design is still about words

Photo credit: Signal v Noise – Reminder: Design is still about words.

Designing the details

When I was scheduling a newsletter campaign in MailChimp, I noticed their clock graphics shows exactly the time I specified. The clock is done by SVG. This is an example showing the benefit of SVG, which can be dynamically changed according to the context. In issue 6, I have shared several resources on using SVG on web.

Notice how the clock follows the schedule select box:

If you enjoy the Web Design Readings newsletter, please consider sharing it on twitter.

Thanks and Best Regards,
Thomas Seng Hin Mak