Through the dying hazes of the alcohol permeating my brain I was once again struck by this passage on the nature of scarcity:
Even in a world without oil, Masdar is still bathed in sunlight. A lot of sunlight. The amount of solar energy that hits our atmosphere has been well established at 174 petwatts (1.740 x 10^17 watts), plus or minus 3.5 percent. Out of this total solar flux, approximately half reaches the Earth’s surface. Since humanity currently consumes about 16 terrawatts annually (going by 2008 numbers), there’s over five thousand times more solar energy falling on the planets surface than we use in a year. Once again, it’s not an issue of scarcity it’s an issue of accessibility.
Moreover, as far as water wars are concerned, Masdar sits on the Persian Gulf – which is a mighty aqueous body. The Earth itself is a water planet, covered 70 percent by oceans. But these oceans, like the Persian Gulf, are far too salty for consumption or crop production. In fact, 97.3 percent of all water on this planet is salt water. What if, though, in the same way that electrolysis easily transformed bauxite into aluminium, a new technology could desalinate just a minute fraction of our oceans? How thirsty is Masdar then?
The point is this: When seen through the lens of technology, few resources are truly scarce; they’re mainly inaccessible. Yet the threat of scarcity still dominates our worldview.
Apart from the obvious TECHNOLOGY F**K YEAH, exclamation that invokes, Peter and Steven are right. Energy and water scarcity are the two biggest resource worries at the present. But we have that stuff in abundance: The sun and the oceans. All we need to do is liberate them, just as our ancestors liberated fruit from tall trees with sticks. It’s not a nature of running out of resources, it’s a nature of making them accessible.
There are asteroids out there in the asteroid belt full of platinum and rare earth metals.
Sometimes when reading we try and find answers, a clue to the internal monologue that will push us to the ideal character or the ideal action that will get us what we want.
But we have to remember that we can simply act to become the ideal character or act to take the ideal action that will get us what we want. The key is that we have to do it for our own internal validation, not external validation.
Which brings us full circle, what is the nature of our internal validation, and how do we fulfill it?
Once in a while a book comes along which ties up a-lot of unanswered questions you’ve been thinking about.
Ryan Holiday’s new book has been just that for me.
If you don’t know Ryan Holiday is the Director of Marketing for American Apparel, and has done work for authors including Tucker Max and Tim Ferriss. He wrote the bestseller Trust Me, I’m Lying: Confessions of a Media Manipulator, where he outlines how he got free national press for his clients.
In his new book Ryan goes about explaining from his experience why traditional marketing is dead, even in his current capacity as Director of Marketing for American Apparel, and what is here to replace it: Growth Hacking.
He then goes on to explain what Growth Hacking is, and how it’s done.
He cites examples from Dropbox to Hotmail, to his personal experience of launching Tim Ferris’s 4 Hour Chef.
The last story is worth the £1.99 in its own right. The 4 Hour Chef was banned from all boycotted by bookstores nationwide. In 60 days, Ryan using Growth Hacking principles was able to make the book an astounding success on launch, making it on the New York’s Bestseller’s list and being No 1 on the Wall Street Journal’s Bestseller’s List.
Why else is this book awesome?
It’s short. It took me 40 minutes to read.
It’s cheap, Ryan specifically requested Penguin Publishers to price it at the $2.99 price range (£1.99 in the UK).
It’s awesome. Ryan “gets it”. As someone who just wasted 6 weeks of his life doing a marketing internship at a start-up, the 1st lesson of the book strikes home for me. The first stage of Growth Hacking is building a remarkable product (an echo of Seth Godin’s Purple Cow).
I also wanted to get my intrapreneurial muscles ready so I read Seth Godin’s Lynchpin. (Yes I am a reading junkie).
One lesson I took away is that Everything You Do Is Marketing.
Before we begin let’s define what marketing is. In my humble opinion marketing is the activity of getting people who don’t know about you to know about you. Converting them into users or customers is the job of selling.
So if we define marketing as letting people know about us, there are a few ways to do this.
We can put up a billboard with a sexy gorgeous woman, with our logo and what we do. This interrupts drivers and passengers and let’s them know about us. This is akin to the kid who screams in the playground about how awesome he is, so that he can make friends.
You don’t want to be that kid. Not in this day and age.
We can buy adverts on Facebook or Google, which comes up on the side of people who we define as really interested in what we do (otherwise called a demographic or a target market. I’m trying to keep this simple ya hear?), they can click through and find out more about us.
This is good. We are reaching people who have a possibility of being interested. The adverts aren’t that interrupting but can be a slight nuisance.
But they’re two problems. If we’re not awesome, or aren’t interesting enough they’ll click away. So we have to be awesome, which we’ll come to later.
Also adverts cost. And they don’t scale linearly. There are better methods which if done right, cost less and have a far higher return. Ads are good to validate your ideas, or for testing. But not as a re-usable channel to get customers. Because at the end of the day an advert is an advert. People trust people more than adverts.
Which brings us to our final option. Get people to talk about you. Yes. It’s common sense. But it’s hard work you say?
It’s not hard work, you just have to take a risk. You get people to talk about you by….
DOING AWESOME SHIT.
Not PR stunts. But being awesome. I’m going to say this again: Everything You Do Is Marketing.
The packaging of your product, the wording of your email, the phone call between your intern and your customer, the copy of your website, the design of your website. Any single time you are interacting with a customer is a time to do something so awesome that all they want to do is share it with people.
Now they’re the cliché methods of Facebook competitions and SEO (both valid techniques by the way), but they’re kinda boring. Let’s focus on off the beaten path techniques.
Alright alright, Virgin are already a recognised brand, so it doesn’t count. Or does it?
Most companies with the success and established brand of Virgin would get boring, and just lie in the fact they’re now an established name in the public. They would stop being awesome.
Apart from Sears went bust, Lehman Brothers tanked, Blockbusters died, and several book chains have filed for chapter 11.
Being incumbent is never good.
I was browsing Facebook when I came across this in my news feed:
But…do you see what they did?
They just injected a bit of their personality into the copy on a toilet lid.
How much do you think that costs?
All you need is a culture which allows itself to take the risk of just being human.
And it resulted in an unsolicited share on Facebook. If I hadn’t had known who Virgin were or if this was some other train company, I would be intrigued. I find this sort of thing funny and I would have Google’d their name to find out more about the company.
From a simply piece of writing on a toilet seat, they would have converted someone who didn’t know about them into knowing about them.
I remember when I re-installed dropbox on my computer, I came onto their installation comic. I found this pane hilarious:
I found it so funny I posted it up on tumblr, and told all my flatmates about it. Now they were students so they already knew about Dropbox, but if someone else had been in the house and they didn’t know who Dropbox were they would have asked a simple question.
*Giggle* “Who’s dropbox?”
As a loyal customer I would then have evangelised and tried to sell Dropbox to this customer. That’s the power of having a True Fan.
Do you see what I’m getting at? Do you see what I mean by Everything You Do Is Marketing? Do you understand why you have to take a risk on having some personality in your product? Why would I want to talk about a generic startup, company or brand that focuses on x to my friends? What’s the story behind it?
Let’s look at one more example…
Facebook Superhero Competition.
We all know about Facebook competitions. We all know about the blatant social sharing behaviour they’re trying to exploit. But Vermont’s Barre Army Navy decided to go a bit further in their competition. They made a buzz about their buzzing competition.
There were a certain number of entry slots available, and it was on a first-come, first-served basis. Contestants entered by posting their “superhero name” and abilities to the page’s wall. Entrants were then pitted one-on-one against each other in a series of ten minute heats. During each heat, the entrant who got the highest number of “likes” on their status moved on to the next round. The catch here was that only people who are fans of the page can like the updates.
Of course, what this did was inspire entrants to get their friends to like the page and then like the status update for their entry. The contest ran over a few days, with the final heat running twenty minutes. The prize was some camouflage netting, something that normally costs over $100.
A number of factors came together to make this contest a success:
It was something different. Many companies run simple sweepstakes or contests where the first to answer a question correctly gets a small prize, but this was intense and much more of a game.
It got people involved. Entrants needed votes, so they recruited their friends.
It was active. This wasn’t just a contest where you submitted an entry form and waited. You actually had to do something to have any chance of winning.
It gave away a valuable prize. Nobody’s going to put that much effort into it for a $10 prize.
It was drawn out. The fact that the contest ran over multiple days offered more opportunities for people to get involved with the contest and recruit others.
It was fun. This might be the most important point here. The contest was not only fun, but it got downright hilarious at times.
In exchange for roughly $100 worth of product and a few days time, this page gained hundreds of new fans. That means all those new fans are now getting the updates they post every day. Most people won’t bother un-liking a page after they’ve gone to the trouble to like it, unless you do something they perceive as very negative (like clog up their news feed or spam them).
They just focused on doing an awesome Facebook competition and BOOM! Everybody is talking about them. People who didn’t know about them, now knew about them. And that my friends is what we defined marketing as earlier.
In conclusion, the point I’m trying to make is you have to inject personality if you want to survive. This awesome post by Fake Grimlock summarises it effectively. You do not pet a rock. You pet a dog. Why? Because the dog has personality.
So do I swallow my own medicine you ask? Well I try when I can. When I entered TaskPandas on my 3rd day I changed the welcome email to new Pandas (people who sign up to our site to complete tasks that customers post) from this
Thank-you for joining and welcome to the TaskPandas community!
We have now activated your account. So login using
your email address and the password you chose at registration and start
posting your tasks today.
To increase your chances of winning your first task we strongly suggest
you upload a profile picture - this will give customers more confidence
when looking at your bids.
We also need you to go through our guidebook containing our marketplace
rules. To view the TaskPandas Guidebook click here:
Please let me know if you have any questions, and happy bidding!
You have been personally approved by our quiet team of meditative Panda monks in Tibet.
By fast carrier pidgeon they have given us the following haiku to pass on to you:
To login gently
Email and password you wrote
To be used today
We’re not great at haiku’s but we do kindly ask that you click “Login” in the top right hand corner and login using the email address and password you registered with here:
If you have any questions, please personally get in touch.
David @ TaskPandas Support
PS If this doesn’t make sense, please email me. Your emails are awesome.
I got told it was too intense, and they’re possibly right. So I dialled back to this:
Yaaay! You’ve been approved!
Here in our office we donned our Panda costumes and celebrated this glorious event.
So… who are TaskPandas?
Here at TaskPandas we find awesome gigs and oddjobs in your local area that you can help out with. We follow up every job just to make sure everything runs along smoothly. We protect our Pandas.
I’m afraid we’re going to have to ask for a favour though.
(But it’ll be real quick I promise!)
First it would be awesome to quickly glance through our guidebook. It’s written for your benefit as we’ll like to foster a community which has awesome people like you: http://www.taskpandas.com/guidebook/TaskPandasGuide.pdf
Finally we would like to ask you to upload a profile photo to your page. We’ve found it helps you win more tasks, as customers trust a human face versus a grey avatar.
David @ TaskPandas Support
Inject some personality into your startup in everything you do. As Alfred says to Bruce Wayne in Batman Begins. “Who knows, Master Wayne? You start pretending to have fun, you might even have a little by accident.”
It’s something that’s recommended in the book. From the 80 or so pages I’ve burned through the book, I gather it’s a tool allowing newbie drawers to project 3 dimensional scenes onto a 2 dimensional plane.
The exact resources:
You will need a piece of clear plastic, about 8″ x 10″ and about 1/16″ thick. A piece of glass is fine, but the edges must be taped. Use a permanent marker to draw two crosshairs on the plastic, a horizontal line and a vertical line…..
The internet being the glorious treasure trove it was, I thought to do a quick google search to see if anyone was selling aforementioned plastic drawing viewfinders.
Google promptly told me in it’s own way… No. (seriously search for it… if there were enough people learning drawing from this book, that’s a small business opportuity)
I checked out clear Perspex on Ebay. That shit’s expensive.
In the limited amount of time I wandered where I was going to find a piece of clear plastic. With my limited budget, and more importantly my limited time, I realised I was going to have to get creative … fast.
So ladies and gentlemen I present how to make a plastic viewfinder for less than £2.
Go to your nearest large store, whether it’s Tesco’s, WHSmith, Home Depot etc. The key is it’s gotta be a large store.
Now here’s the hunting part. Your mission, if you choose to accept it, is to find any object which has a clear plastic component that is flat and larger than an A4 piece of paper. Look for anything. I initially considered Tupperware covers, but then found this teacher’s certificate box:
With your discovered piece of plastic, using a ruler measure out an 8″ x 10″ rectangle to cut.
Next find a piece of cardboard. Any will do as long as you can make a section larger than an A4 piece of paper. Now measure out a 8″ x 10″ rectangle. Then a 6″ x 7 5/8″ rectangle inside that. Stick a scissors in the middle like you did in primary school and cut out that tough son of a bitch.
Tape the cut out cardboard frame and stick it to your plastic with some tape
Finally find a permanent marker and draw crosshairs in the middle of the pane. Like you find in old fashioned windows.
Voila, you have a plastic drawing viewfinder! And for less than a cup of coffee.
I was once on an outing with a girl and we came across a public chalkboard. She started doodling little cartoons and iconic animals, and was encouraging me to do the same. I wouldn’t.
It wasn’t that I thought it was silly (I love doing silly things), I just couldn’t in any manner at that time. For me it was akin to someone asking me to roll my tongue when I couldn’t, or speak Spanish when I couldn’t.
I couldn’t draw. Not even to save my own life. It seemed the neural connections in my brain just didn’t exist.
However I know exactly why I can’t draw.
Back when David Heasman was a young sapling in the British Primary Education System, he used to get frustrated when asked to draw anything. This continued through into his later years. And it wasn’t the frustration with drawing that used to bog him down, it was the frustration that such a manual method was required to put one’s imagination to paper. I used to dream of a device which would transfer the image of your mind onto the paper. Just as I used to think learning languages was redundant as the Universal Translator would one day be invented.
At least I was right about one thing.
Anyway getting back to the matter at hand, I can’t draw. So why all of a sudden do I want to learn the damn thing?
There are a few reasons. One is after browsing DeviantArt and reading ImagineFX, I’ve developed the desire to paint some badass spaceships, awesome samurai warriors, and just general inspiring paintings. I bought a wacom purely for that purpose. Only to realise I have no idea how to “see” a scene. Secondly after I carried out one specific drawing exercise (the famous draw a picasso drawing upside down.) I found the process to be both meditative and relaxing.
Also this is a deficiency. Deficiencies are bad. I want to address all my deficiencies.
But learning to draw isn’t enough. I gotta set a deadline otherwise it won’t happen. So I choose 30 days. From some of the stuff I’ve seen about Metalearning (see the 4 Hour Chef Meta Learning Chapter and Josh Kauffman’s First 20 Hours), you need to have a tight deadline. And all you need is 20 hours to become decent at a skill.
So I choose 30 days to learn to draw. To do this I’ll practice drawing 45 minutes everyday.
While most of what I do is going to be practice I’ll use Drawing On The Right Hand Side Of The Brain by Betty Edwards for deconstruction and autocorrect purposes.
Stay tuned later today for my absolutely horrible first piece of drawing.
During the past year of reconfiguring satellites (a gross exaggeration of my Masters Project) and recruiting an army to take over the world (another gross exaggeration of my marketing efforts for UCL’s Entrepreneurs Society) and general student times (that bit’s exactly what you think) I’ve not had the time to figure out what to blog.
So today I say bye bye to the old blog. I’m going to do a subtle rebranding. The mission statement underneath the blog’s logo is going to read like a shizophrenic’s diary over the next few weeks. I’ll be refreshing it with almost every blog post as I try and figure out the general theme I’m going to blog about.
However in the meantime I’ve got a few projects in the works. One of which I’ll be blogging about heavily for the next 40 days.
Amazing Blog Author’s note: This tutorial was supposed to have helpful images along with the instructions, however my uh, hard-drive blew up, and those images weren’t backed up. I’ll update this post soon with the aforementioned images. Moral of the story, always always work in dropbox.
As I so elaborately wrote about in my previous post, I’ve been teaching myself how to use the adobe creative suite. And by use I mean for something other than creating crappy posters. I have been learning how to use Photoshop and Dreamweaver to build websites.
I’ve been using an infiniteskills video course to guide me, but as I haven’t finished it yet I’m unable to write a review. Instead I’ll give a quick tutorial on how to draw a website wireframe in photoshop.
Uh… What’s a wireframe?
Before I completely dive in, I’m sure it would be useful to actually know what a wireframe is. Many people out there on the internet do know this, and if you’re one of those…. just skip this paragraph. Otherwise these words will just be a waste of your time.
If you don’t know what a wireframe is, worry not. A wireframe is just a fancy name for the 1st rough outline of the design. As I’m talking about web design it would refer to a document which shows roughly where the different areas of content will be on the webpage.
Okay, that makes sense. But why can’t you just sketch the damn thing on paper and be done with it?
You may not have asked this question, but it’s a pretty cool question. It’s useful to draw your wireframe in photoshop or in HTML as you’ll use this as the foundation block to draw our further designs. Rome wasn’t built in a day, and your website is sure as hell not going to be built in one pass.
Okay – To The Tutorial!!!
First it would be very useful to figure out what website you actually want to build. For no reason at all, I’m going to focus on a splash page for a web service.
The first step, sketch the various blocks on paper. No need for stuff to align or for the proportions to be right. It’s a sketch:
So this webpage is going to be a bit simple. For a splash page a Logo and a navigation menu will be on the top. Underneath will be the headline copy or image which will attract the visitor’s eyes and show off the key benefit of the service. Underneath in the 4 smaller boxes, will be further benefits and features which describe the service. Underneath will be a FAQ box, and to the right of that a section with miscellaneous information. Underneath all that will be a footer. There will also probably be a call to action box somewhere above the footer, but no need to worry about that now.
Next as we’re building a web page, we should make sure photoshop is set up to give measurements in pixels. Load up Photoshop on your favourite operating system. Then go to Edit → Preferences → General or press Ctrl + K (or Cmd + K if you’re on a mac).
Go to Units & Rulers
You then want to change Rulers to be in pixels.
Let’s now make a new image. There’s lots of talk about adaptive web design and what is actually the right width for a website. For now we’re gonna keep life simple, so that we can actually learn about this stuff.
Click on File → New and you should get this dialog:
Set an image size for a width of 960 pixels and a height of 2000 pixels.
You should then get this screen. Double click on the image you just created, or press f for “fullscreen”
Another day I’ll talk about what I feel is the most optimum workspace for web design, but for now the windows you’ll need for this exercise are the Tools and Layers panels.
We should create some guides for this wireframe. I’m going to keep it simple and just divide up the page into thirds. Show the ruler by going to View → Rulers or by pressing Ctrl + R (Cmd + R).
We’re then going to create guides. First make sure “show guides” is turned on by going to View → Show → Guides or pressing Ctrl + ; or Cmd + ; . Then we’ll make a guide by dragging from the ruler on the left hand edge of the workspace like so:
⅓ of 960 pixels is 320 pixels, and ⅔ of 960 is 640 pixels. Hence I’m going to drag the guide to 320 pixels, zooming in when necessary to get the exact value (Quick tip, zoom in by pressing Ctrl and + or Cmd and +. To zoom out Ctrl and – or Cmd and -), and then doing the same for 640 pixels.
Now before we do the easy but important task of making our wireframe we should work out what the exact measurements are. There are a few ways of going about this. You can go back to your sketch and make some educated guesses of what the pixel size of the blocks should be. Or you could just throw down some rectangles and resize them to get their rough size and position and resize them later.
My workflow involves making sure photoshop is at 100% zoom, so that I can actually intuitively see what the website will look like. I know that I want the second box, the largest box to be “above the fold”, i.e. users with 720p displays will be able to see that block when they initially come to the page. For arguments sake I’m going to call this at 600 px. I’ll then throw down the shapes and play around with resizing them to see what works and what doesn’t.
I’ll change the colour to a neutral gray, it’s just what I prefer, you can make it pink or gold if you want.
Use the rectangle tool to draw a rough rectangle. Then resize it using the move tool. Click on the shape with the move tool. Launch transformation controls by either clicking the checkbox “Show Transform Controls” at the top, or by pressing Ctrl + t or Cmd + t. Drag and play around with the corner boxes to get the size you want. Then press enter twice or click the tick button in the top bar.
Rinse and repeat with other rectangle shapes, play around with them to get the design you want.
Once you’ve finished this there are two things you need to do. First you need to rename the shapes in the layer panel so you don’t get lost. Do this by double clicking the name in the layer panel. If you have “Show Transform Controls” checked, the shape should become highlighted in the workspace. Rename the layer to something you’ll remember. Uh, you know… like “header” or “Dragon’s tail”… or whatever works for you. I’m gonna keep it simple and call mine things other people will understand though….
After you do this, you also should crop the canvas to get rid of the spare white space at the bottom. You’re not exactly going to use it are you? So crop and delete it.
Do this by pressing the crop tool. Then drag around the selection of stuff you want to keep.
BAM!! You got yourself a wireframe! You can now:
Play with your cat/video games
Think about the stuff you’re going to put on top of those wireframe boxes
If the job is for a client, you’ll probably want to send if off for review. If you’re going to do that some extra steps are necessary. You’ll want a label for each of the boxes so the client knows just what the hell they are. They can also offer any adjustments or corrections now. I say now, because you don’t want to start adding extra features after you’ve built half of the damn website via html & css.
Its very simple to label the wireframe boxes. Grab the type tool. And I’m sure you know how to place a cursor and type right? Well go and do that.
Pro tip, make one label. Play around with the font/stroke to make it as pretty as you want. Then copy that label to the others by using the move tool and holding alt while dragging it. (Uncheck “Show Transform Controls”). Rename the labels by double clicking on them with the type tool.
Afterwards also rename the labels in the layer panel. You may also want to group them by clicking Ctrl + g, so your label panel doesn’t become too clustered.
There you go, you’re actually finished! You can send the wireframe off to review as a pdf.
If you enjoyed this post, why not subscribe? There’ll be awesome follow ups every tuesday and friday.