Central Perk

luni, 26 noiembrie 2012

Building Chrome Apps and Extensions for Fun and Profit

Posted: 25 Nov 2012 06:48 PM PST

At our recent Searchlove conferences, Mat Clayton from Mixcloud gave a tip I really liked. He pointed out that because his company competes with Spotify and others who have installable desktop applications, they need to do extra legwork to stay front-of-mind with their users. One of the ways they thought to do this was by creating a Chrome app (you can get the Mixcloud app here):

Mixcloud Chrome app

By placing their brand right on the new tab screen of Chrome, they get a little bit of mind-share every time a user opens a new tab. They advertise their app throughout the site using remnant ad inventory any time you visit the site using Chrome - and Mat told us it's had a big take-up.

Great. I thought. Smart. Sounds hard.

Not so.

Mat made an off-hand comment that the entire app was "11 lines of code or something."

"I can do that" I thought

...and with that, Mat won the prize for having the first Searchlove tip I implemented when I got back to the office. I built a DistilledU app to put my brand right there next to Mixcloud:

DistilledU chrome app

[Side note: you might look at that logo and think it looks a little different to the one you've seen on our website and you'd be right. Call this a sneak preview of some brand revitalization work we are doing - I'd love to hear your feedback!]

What's the point? Isn't this just a bookmark?

Essentially, yes. But it's a bookmark that comes with great branding benefits for early movers. Most people don't have that many Chrome apps installed, if you have a great product that people use frequently, users on Chrome seem to be responsive to suggestions that they should install an app for "rapid access to <brandname>."

You can see this in action in the reviews of Mixcloud's app - notice how they are all reviews of the Mixcloud service rather than of the Chrome "bookmark".

I'll talk a bit more below about the ways you can take this further, but for now, let's learn...

How you can do the same for your brand

I like to learn new things, so I didn't bug Mat for his code. Now, I want to show you how you could have the same thing for your brand in literally the next 10 minutes regardless of your coding skills. You'll need $5 on a credit card, a Google account, your logo, coffee, and a stopwatch? Ready? Go!

I'm going to demo the process using SEOmoz as an example.

Here's how Rand could ship an SEOmoz PRO chrome app:

Step 1:

Grab my basic outline code from github.

Step 2:

Unzip it.

Step 3:

Drop the SEOmoz logo into the unzipped folder (you can deleted "distilled-small.png") and remember what you called it:

SEOmoz logo for Chrome app

(You want a square logo of size 128x128).

Step 4:

Open the file "manifest.json" in notepad and carefully change just the sections marked in angle brackets such as <Your app name goes here> so the file changes from:

Initial manifest.json

to:

Manifest.json after editing

[Pro-tip: you can add Google Analytics tracking parameters on the end of the URL if you want to track how much people use your app to find your site - I used ?utm_medium=chrome&utm_source=app]

Step 5:

Give it a quick test by:

Opening your extensions panel
Enabling developer mode with the checkbox at the top of the page:

Loading an "unpacked extension"
Choosing the folder where you unzipped the code above

If all has gone to plan, you should see something like this:

Unpacked extension

And when you open a new tab, your new app should be right there:

SEOmoz chrome app

Step 6:

Zip up the folder:

Zip up the folder

Step 7:

Publish it!

Head over to the Chrome Developer Dashboard (log in with your Google Account)
Upload your zip file
Fill out the information
[Optional: if you want to publish your app outside your Google apps domain, you need to pay $5]
Hit publish:

Edit your app

I can't publish an official SEOmoz one because my Google account isn't authenticated against the SEOmoz domain (I'll save Rand the 10 minutes of work and just send him the zip file) but here's the DistilledU one if you want to try it out for yourself.

Was that too easy?

If you want to level up a bit further, you start getting into real app functionality, extensions, etc. Google has clearly invested a lot of effort in the documentation, so you'll want to start here:

Chrome developer resources
Web store guide
Guide to packaged apps (the app we built above is a "hosted web app" which means it's essentially the same as a regular web app that can get access to some additional Chrome APIs for things like local storage, notifications etc. Packaged apps use the Chrome environment to build full-on apps like those you find on the Chromebook)
Guide to extensions

I thought I would end with a little story about where I went next after I'd shipped the simple DistilledU app above. Warning: I'm not a developer yet I'm about to show you some code snippets. Don't trust my code - take all of this as a starting point for doing your own research into what works for your business.

We are building notifications into our site

DistilledU alerts

After I built the app above, I got thinking about how I'd love to expose those notifications in the browser. Thinking about it a bit more, I thought I could go further than that and build an extension through which we could curate industry news alerts (a combination of things we've written and stuff we rate from around the rest of the web). So I built one (you can get it from the Chrome store here):

Distilled notifier

...and get curated cool stuff from Distilled:

Distilled notifier dropdown

This is a few more lines of code and is a little more technically complicated than the app above. You'll need some HTML / JS experience to follow along, and I'm not going to walk through every mouse-click, but here's the high-level view:

Let's build a browser action

There are two kinds of Chrome extension

Page extensions that apply on a per-page basis and appear in the URL bar
Browser extensions that sit next to the URL bar (like the SEOmoz extension)

I want my notifier to appear all the time, so we're building a browser action. This leads to a manifest.json that looks like this:

Extension manifest

The popup box is basic HTML and JavaScript

The security restrictions of building extensions means that there are some slight bits of weirdness, but we start by essentially just writing some HTML and JS.

Let's start by looking at background.js - which runs permanently in the background fetching updates so that we can (a) display an alert when there are new notifications and (b) we don't have to wait for the notifications to load when we click on the icon. Background.js looks like this (click for larger version):

When you click on the icon, it displays popup.html in a little drop-down window. Popup.html looks like this:

Popup html

The observant among you will notice that there is essentially no content in here - it's added by jQuery in popup.js (click for full size version):

I found that building a notification took (unsurprisingly) a lot more debugging than building the simple app. There are two debugging tips if you plan to try this at home:

1. You can access the console for the background page via the extensions page:

Background debug

2. You can debug the popup with "inspect element":

Right click to inspect element

This gives you access to all the regular debugging tools like the JavaScript console and the ability to force refresh of assets like the .js files (I found that some of these were cached aggressively which made debugging tricky).

I hope you've found something useful in all my learning efforts. At the very least, you can make a simple app to link to your site. I'd love to hear about anyone who takes the extension side of things further. To make all this effort worthwhile, I'd love it if you would check out:

Distilled curated industry notifications, and
DistilledU web app (needs at least a free DistilledU account)

Sign up for The Moz Top 10, a semimonthly mailer updating you on the top ten hottest pieces of SEO news, tips, and rad links uncovered by the Moz team. Think of it as your exclusive digest of stuff you don't have time to hunt down but want to read!

Seth's Blog : Four questions worth answering

Four questions worth answering

Who is your next customer? (Conceptually, not specifically. Describe his outlook, his tribe, his hopes and dreams and needs and wants...)

What is the story he told himself (about the world, about his situation, about his perceptions) before he met you?

How do you encounter him in a way that he trusts the story you tell him about what you have to offer?

What change are you trying to make in him, his life, or his story?

Start with this before you spend time on tactics, technology or scalability.

• Email to a friend •

duminică, 25 noiembrie 2012

Mish's Global Economic Trend Analysis

Constitutional Crisis in Spain; Pro-Referendum Parties Win 87 of 135 Seats

Posted: 25 Nov 2012 07:30 PM PST

Spain takes a giant step towards a full-blown constitutional crisis as Catalans overwhelmingly elect candidates promising a break-up vote.

Catalonia has delivered a sweeping mandate to political parties pledging to hold a referendum on independence in elections that place the northern Spanish region on a collision course with Madrid.

In a vote billed as "the most decisive elections in the history of Catalonia" by Artur Mas, the region's president, pro-referendum parties won 87 of the Catalan parliament's 135 seats.

Following weeks of intense debate about Catalonia's future relationship with Spain, turnout was 69.5 per cent, the highest for a Catalan regional election in nearly 30 years.

The vote comes amid pressure from various regions around Europe for more independence, including proposals for a referendum on the issue in Scotland in 2014.

Spain's central government has said any move to push ahead with a referendum on independence for Catalonia, which has an economy the size of Portugal's and makes up about a fifth of Spanish output, would be illegal and against the Spanish constitution.

Catalonia has built up a debt pile of €42bn, the largest of all of Spain's 17 regions, and is currently locked out of international capital markets. Earlier this year the region was forced to request an emergency €5bn credit line from Spain's central government to avoid defaulting on payments.

Messy Politics

The ruling (Center-Right) Convergència i Unió party which favors a referenced actually lost 12 seats in the election, from 62 to 50. However, it lost those seats to more radical pro-independence groups.

Artur Mas, leader of Convergència promised a referendum but will have to align with even more radical groups to produce one according to CNN.

Artur Mas, president of the region's parliament, promised a referendum on independence for one of Spain's most important regions if he won re-election.

But after the election, Mas has a more difficult task because his center-right Convergence and Union coalition lost 12 of its 62 seats, a strong setback for a party that was hoping to gain a simple majority in the 135-seat legislative body.

The Catalan Republican Left party was the big winner in the elections, winning 21 seats, according to the Catalonia elections web site, which reported 98% of the votes had been counted.

The Catalan Republican Left party also backs independence, and the two parties could form a majority in parliament on the independence issue.

They, however, differ on most other issues, especially economic policy.

Voters in Catalonia, the most powerful economically of Spain's 17 regions, heeded the call that these would be historic elections, even if independence wasn't on the ballot Sunday. They voted during a deep economic crisis in the eurozone countries, especially in Spain and in Catalonia. Voter turnout was the highest in 24 years for Catalan elections, officials said.

The Spanish government in Madrid vows to block any self-determination referendum, arguing that the constitution does not permit a region alone to decide its independence.

Last September 11, an estimated 1.5 million people -- 20% of Catalonia's population -- filled the streets of Barcelona, the Catalan capital and Spain's second-largest city, demanding independence.

A survey earlier this month by the Catalan government's polling center showed 57% of Catalans would vote for independence, a 6% increase from last June and a 14% increase from a year and a half ago.

Judging from the election, I suspect the percentage who would vote for independence is much higher.

A showdown with Madrid looms.

Mike "Mish" Shedlock
http://globaleconomicanalysis.blogspot.com

450,000 Businesses Shut Down in Italy; Non-Performing Loans Jump 15.3%, Write-Downs 21.6%

Posted: 25 Nov 2012 11:47 AM PST

Here are a couple of interesting economic links from Italy courtesy of reader Andrea. The translations from Italian are a bit choppy, but the gist of the articles is easily understandable.

Non-Performing Loans Jump 15.3%, Write-Downs 21.6%

From Thompson Financial News: Non-Performing Loans Jump 15.3%

Non-performing loans amounted to approximately 117.6 billion, 1.8 billion more 'than in August and 15.6 billion in more' than in September 2011, marking an annual increase of 15.3%.

With regard to loans net of write-downs at the end of September totaled 67.2 billion, about 1.5 billion more 'than a month before and almost 12 billion more' than in September 2011, with an annual increase of 21.6%.

450,000 Businesses Shut Down in Italy in Three Years

La Stampa reports 450,000 Businesses Shut Down in Italy in Three Years.

In just three years, from 2010 to 2012, about 450,000 companies closed with a loss of over 300,000 jobs, while the Italians caught up in terms of wear [usurious loans] increased to 600,000.

These are the data provided by Sos enterprise-Confesercenti usury-day. In particular, wear Italian capital Rome and Naples are confirmed.

It is "wear submerged, chameleon, now violent now` hit and run 'which marks a difference between the demands of incredible help and legal reality." [Bankruptcy looms]

The President of Confesercenti Marco Venturi pointed out that "the rest of the bank lending to businesses fell by 6%, rising instead both protests, particularly in the South, both failures, especially in Lombardy and the north-east. Do not forget that over the years has formed an army of 5 million people who for various reasons - bad payers, protested - is effectively excluded from the banking system and therefore must satisfy all its needs for cash."

The fact that more businesses shut down than jobs lost in those businesses says that many of the businesses are shell corporations. However, the implied stress is very real.

For more from Andrea regarding Italian bankruptcies, please see Reader Comments on Italy's Insane Labor Rules

Mike "Mish" Shedlock
http://globaleconomicanalysis.blogspot.com

Seth's Blog : Persuade vs. convince

Persuade vs. convince

An anonymous copyeditor working on my new book unilaterally changed each usage of "persuade" to "convince."

I had to change them all back.

Marketers don't convince. Engineers convince. Marketers persuade. Persuasion appeals to the emotions and to fear and to the imagination. Convincing requires a spreadsheet or some other rational device.

It's much easier to persuade someone if they're already convinced, if they already know the facts. But it's impossible to change someone's mind merely by convincing them of your point.

If you're spending a lot of your time trying to convince people, it's no wonder it's not working.

More here.

• Email to a friend •

luni, 26 noiembrie 2012

Building Chrome Apps and Extensions for Fun and Profit

Building Chrome Apps and Extensions for Fun and Profit

"I can do that" I thought

What's the point? Isn't this just a bookmark?

How you can do the same for your brand