iPhone 4 Lands June 24th, 2010

I tell you, the last few months have been crazy over this new device! First of all, we caught a glimpse into the world of Apple when a man by the name of Gray Powell left a prototype device at a bar in Redwood City after celebrating his birthday. Shortly after he left the bar, someone found the device and sold it to Gizmodo who then explored the device to it’s fullest to get a clearer idea of what it was.

Gizmodo broke the story about the iPhone 4 to the world, thus causing Apple to sue for theft and have the editor who wrote the article turn over his property to the cops for evidence.

Once the phone was finally claimed by Apple and then officially announced, all we wanted to know was “how much?” and “when can we buy?”. Not only did the phone itself cause the demand to be exceptionally high, but the announcement of AT&T allowing early upgrades for basically any contract that would be expiring in 2010 opened to flood gates to just about every single previous iPhone owner.

Black Tuesday

June 15th was the day selected for the pre-ordering of iPhone 4 and boy what a day it was! Here are a few of the things that went down (pun intended) that day:

  • iPhone 4 Pre-order system shuts down – The pre-order system was opened at about 1am on June 15th and right from the start, people were complaining about not being able to get in the system to place an order.
  • AT&T account security breaches – Many AT&T users (including me) experienced a wide-spread security breach within AT&T after logging into their wireless accounts online. Instead of seeing their own information, they were presented with the information of someone completely different.
  • AT&T stores took iPhone pre-orders on paper – Many customers (including me) were forced to have a pre-order written down on paper only to be processed later.
  • iPhone 4 orders were being randomly cancelled – It almost seemed completely random, but iPhone 4 orders were getting cancelled left and right with no apparent reasoning behind it. I think it had to do with people placing multiple orders on single accounts or the old rule about upgrading your account where you actually couldn’t upgrade if you had a balance due. I made sure I paid my bill before I started this process!!
  • Shipping date for iPhone pre-orders pushed to July – It appears like July 14th is the earliest date you can expect your iPhone to ship. The demand was just too much for AT&T and Apple to handle.
  • Best Buy was pre-ordering white iPhone 4s – Somehow, a few people were able to successfully order a white iPhone 4 from Best Buy even though it was clearly stated that the white iPhone 4 would not be available at launch date. We’ll see about the “successfulness” on June 24th!

The Aftermath

After all this, AT&T and Apple have both formally apologized. Apple released this statement:

CUPERTINO, Calif., June 16 — Yesterday Apple and its carrier partners took pre-orders for more than 600,000 of Apple’s new iPhone 4. It was the largest number of pre-orders Apple has ever taken in a single day and was far higher than we anticipated, resulting in many order and approval system malfunctions. Many customers were turned away or abandoned the process in frustration. We apologize to everyone who encountered difficulties, and hope that they will try again or visit an Apple or carrier store once the iPhone 4 is in stock.

And AT&T had this to say:

DALLAS, June 16 — AT&T issued the following statement today:

IPhone 4 pre-order sales yesterday were 10-times higher than the first day of pre-ordering for the iPhone 3G S last year. Consumers are clearly excited about iPhone 4, AT&T’s more affordable data plans and our early upgrade pricing.

Given this unprecedented demand and our current expectations for our iPhone 4 inventory levels when the device is available June 24, we’re suspending pre-ordering today in order to fulfill the orders we’ve already received.

The availability of additional inventory will determine if we can resume taking pre-orders.

In addition to unprecedented pre-order sales, yesterday there were more than 13 million visits to AT&T’s website where customers can check to see if they are eligible to upgrade to a new phone; that number is about 3-times higher than the previous record for eligibility upgrade checks in one day.

We are working hard to bring iPhone 4 to as many of our customers as soon as possible.

After the aftermath

The dust appears to be settling and the lucky people who got orders in on the 15th or manual orders on the 16th (taken on the 15th) are starting to see shipping information in their AT&T accounts. The blogs are on fire with people talking about their own personal experiences and of course griping from people who aren’t getting theirs on day one.

I had my own streak of good luck turned bad and then turned good again. I started off with two orders for the same account and then I thought I was getting none. I was thinking I’d see my phone in mid-July, but then I got the good news that mine had shipped! You can read my whole story on my blog. The story is called ‘How I Almost Got Two iPhone 4s on Release Day‘.

UPDATE 6-23-10

I just wanted to share that I received my new iPhone 4 today and from what I’m hearing, I’m one of few that actually received the device today and even fewer received it yesterday. Here are my last pictures from my iPhone 3GS (which is now on sale on eBay) and the first ones of my new iPhone 4.

©2010 Brandon.me and Ledfrog.com

©2010 Brandon.me and Ledfrog.com

Visual Design – Color Pallets

As equally important as whitespace is the choice of colors throughout your site. These colors can represent your company’s existing logo properties, a particular color scheme used throughout the products you sell or simply just a series of colors that are pleasing to the eye.

If you’re just starting out a business, choosing the color scheme is much easier because you can essentially start from scratch. You may even begin by choosing the desired website design and then using it as a starting ground for your branding.

What colors do you use?

Surprisingly, not a lot of thought goes into this question for most web designers. The problem is that most people simply start with a cut and paste approach to website design and copy elements off a template. For example, lets say you downloaded a fresh new template that was all black and red. You got it because you liked it and it was cool. Rather than come up with your own color scheme or layout options, you forced yourself to use the ones in the template.

Now this isn’t such a bad idea if you just want to whip a fast site together, but if you’re in it for the long haul, you are missing out on future opportunities to market and brand your site better.

Think about a big name company’s image. Is their logo one of those logos that you can take a half-second glance at and still know what it was you saw? You have to remember that when you’re starting a business, your choice of colors and theming is the most important thing for your image and/or brand.

How do colors benefit readers?

Besides the overall look and feel of your site, your visitors are going to benefit greatly from your choice of layout. That’s because colors play a large role in visual response. Ever wonder why most of your local big-chain restaurants use the color red in their logos and marketing materials? This is because some scientist did a study a while back and determined that the color red is closely associated with the feeling of hunger and generally speaking, a red sign pointing out a flashy restaurant is supposed to make you more hungry.

The same can go for your website. The proper use of white space, the choice of colors and even the style of font and logo design can all keep your users browsing or drive them away. Of course, a lot of web users don’t care what your site looks like as long as you have the information they were looking for, but as you get more and more into the Internet, you deal with more and more competition. This means that any edge you can obtain is something worth considering.

My two cents

This post was more of an eye-opener rather than actual help, but that’s because nobody can tell you how to design your site. Only you (and others with similar sites) can know what your visitors like or don’t like. If you really want to find out, look at other sites in your field or start polling your own visitors to see what they think.

<< Back to White Space Forward to Image Slicing >>

Visual Design – White Space

White space is the most literal concept you’ll find in this section. It is the actual space between design elements such as paragraphs, images, text, graphs, etc. The purpose of this space can vary depending on your desired results. One reason for using it might be to create a specific flow to your design. You may want to direct one’s eyes to something on a page more so than other items.

By the way, WebDesignNuts.com created a great article about how to use white space effectively, but to summarize, I’ve written a little piece myself.

Effective use of white space

The most common use of white space can be found in just about every publication on Earth including almost every website you’ve been to. What I’m referring to is the breakup of large blocks of text into smaller chunks that can be more easily digested. The following text is NOT effective use of whitespace:

We are guessing that most of you have already read Gizmodo’s account of how they managed to obtain a prototype for the upcoming Apple iPhone 4G device. If you have, then you’ll know that the whole thing was allegedly down to a 27 year old Apple Software Engineer, named as Gray Powell, who managed to leave the prototype in a bar in Redwood City, Calif. Now that the whole thing has come out, and Apple are yet to confirm or deny the story – what will the repercussions be for Mr Powell? Every human makes a mistake once in a while, but you have to say that this is a major blunder if it turns out to be true. Will Apple remove Powell from further duty, or will common sense prevail and no firm action will be taken? Hopefully it will be the latter, but you never know with Apple. Let us know your opinions on the whole saga and what YOU think should happen to Gray Powell.

-Text quoted from Product-Reviews.net

The text above looks much better if formatted properly:

We are guessing that most of you have already read Gizmodo’s account of how they managed to obtain a prototype for the upcoming Apple iPhone 4G device.

If you have, then you’ll know that the whole thing was allegedly down to a 27 year old Apple Software Engineer, named as Gray Powell, who managed to leave the prototype in a bar in Redwood City, Calif.

Now that the whole thing has come out, and Apple are yet to confirm or deny the story – what will the repercussions be for Mr Powell?

Every human makes a mistake once in a while, but you have to say that this is a major blunder if it turns out to be true. Will Apple remove Powell from further duty, or will common sense prevail and no firm action will be taken?

Hopefully it will be the latter, but you never know with Apple. Let us know your opinions on the whole saga and what YOU think should happen to Gray Powell.

-Text quoted from Product-Reviews.net

Now imagine if an entire website appeared like the first block of text! Just looking it would make you want to change the page. To make effective use of white space, you need to focus on things other than breaking paragraphs apart. Here are some things to consider:

  • Line spacing – In college, you generally had to make all your papers double-spaced, but on websites you can space as much as you like, even down to the last pixel.
  • Margins – Keep side bars and advertisements at bay so they don’t crowd your page too much. In general, you don’t want to flood your site with stuff like that anyway, but more importantly, you want to keep it away from your content. After all, you visitors don’t come to your site to look at ads.
  • Headings – Make sure your headings stand out and properly define the content below them. This isn’t just good practice for design, but also search engine rankings as well.
  • Images – How often have you been to a site where the images seem to be mixed right in over or under the text? Your images should standout alone and text should either wrap around them or stay on one side.

More information

This was just a sampling of what to look for when designing your pages. I’d suggest doing a deep search if you think you’re having problems adjusting content on your pages. If all else fails, get yourself a web template or theme that controls the layout for you.

<< Back to Layout Forward to Color Pallets >>

Visual Design – Layout

A crucial design element of your website is the layout. Believe it or not, there are phycological studies on the layouts of other media such as magazines and newspapers. Small, but important details including where certain text is, how big the titles of pages are and what colors are used are all attributed to the success or failure of a website.

The best way to get ideas for your own site’s layout is to look at other related websites that contain similar content and see what it is that you like and don’t like about it. What I do is look at a site for a few minutes, close my eyes and then try to remember the things that stood out.

Choosing the right layout

As you scour around the Internet, you may notice design patterns spanned over the various websites you see. You might have noticed that most news sites tend to favor white backgrounds with black text. You’ll notice media sites like YouTube and Hulu that design the rest of the site around their video players.

The point of any layout is to draw attention to a specific area of a page to generate the most focus on that spot. This will ensure that if you’re blogging, your content is being read or if you’re showing videos, that your videos are being watched.

Just take a look at my site. You can see how things are organized within a matter of seconds. Every page conforms to the same layout in general and this was done to keep everything looking clean as well as to allow the content to flow. When you create your own site, you want to make sure that the design flows and matches, but not to mix everything together. This can confuse your visitors and will probably make them leave your site.

Themes and templates

Both of these are generally the same. The difference is how they’re applied. A template is a set of pre-built files that make up a website that allows you to fill in or change information to correspond to your own needs. A theme does the same purpose, but it’s applied to a pre-built structure. The main difference between themes and templates is that you can change the theme of an entire website without affecting too much of the content. A template needs to be re-edited if it’s changed.

If you’re running a blog site, using is theme is the only way to go. This is because WordPress is a full software package all rolled into one that allows you to apply different color and layout themes as needed.

Here are a couple of place to look for great themes and templates:

  • TemplateMonster – This site has thousands and thousands of web templates and they even have themes for content management systems like WordPress, Drupal and Joomla. Their prices range from about $20 to $150.
  • WooThemes – WooThemes makes themes specifically for WordPress, ExpressionImage, Drupal and Tumblr. They have some free themes, but the paid ones seem to be of much higher quality and generally have more features.
  • StudioPress – If you want to up the ante (and the price) on quality WordPress themes, you need to go here! In fact, if you want to see a sample of one of the themes they offer, you can look at my other website.
<< Back to Stock and Graphics Forward to White Space >>

Visual Design – Stock Images and Graphics

Naturally you need images to help add to the design of your website and in the case of managing a blog site, you also need them to help sell your point. There are millions of images all over the Internet, but the problem is that you have to contend with copyright laws and trademark issues.

So what’s the answer to this dilemma? Basically you have three choices. One, create all the images yourself. Two, find royalty-free images to use. Or three, consider purchasing/using stock images and graphics.

What are stock images and graphics?

Stock images are usually a generic image of something that you use to sell a product or add dimension to a piece of writing. You might have seen on eBay for example an item listed and a caption underneath stating stock photo. This just means that the picture you’re looking at is not of the actual item for sale, but it is an image of the item.

Stock photos are also used for magazine, newspaper and blog articles. I picked up the image above right off of one of the sites below and added it here to create some color for this post.

There are companies out there that specialize in the distribution of images and graphics that were created by various people for the express purpose of using in specific applications. Some stock images are free, most you have to pay for. Sometimes, you must also take into consideration the format in which they are allowed to be used.

Where do I get these images?

There are plenty of places online offering stock photography and a quick web search will do the trick, but here are a few of the ones I find to have the best quality images

  • Stock.Xchng – This site is considered to be the leading stock image site for FREE images, so you may want to make this your first stop before paying for photos elsewhere.
  • Getty Images – If you want to search through over 24 million photos, this is the only place you can do so. You have probably seen many, many photos in magazines, web articles and more that have a photo credit to Getty Images. Well, now you can get access to these same images!
  • BigStock – The thing I like about this site is that you buy credits to use for purchasing images and not every image is the same credit price. Plus, the more credits you buy up front, the more you save.
  • Shutter Stock – Here’s a great royalty-free collection of images that I just recently came across, but it seems to have a lot to choose from.

My two cents

Use photos as often as needed, but don’t overdo it! You don’t want to crowd your page design with images and graphics that don’t apply to your content. Last but not least, never use copyrighted images without permission! People like me, who create original content, do not appreciate it when people simply take our creations for their own advancement. Speaking of which, you might want to check out my copyright information to see how I allow my site to be used!

<< Back to Software Forward to Layout >>