Créer un QR code Foursquare

Créer un QR code Foursquare

Dans le cadre de la cinquième saison du Café Numérique, j’ai entrepris la création d’un QR code Foursquare pour chaque soirée.foursquare logo

Ce QR code permet d’ouvrir l’application Foursquare si elle est installée sur votre smartphone Android. S’il elle n’est pas installée ou que vous utilisez un Iphone, c’est l’application web mobile qui s’ouvrira.

Pour créer le code barre 2D j’utilise ce site : http://keremerkan.net/qr-code-and-2d-code-generator/ mais il en existe d’autre comme http://zxing.appspot.com/generator/ que j’aime aussi beaucoup.

Récupérer l’URL

Prenons un lieu, par exemple : Microsoft Executive Briefing Center et cherchons le sur Foursquare, nous trouvons l’URL suivante : https://www.foursquare.com/v/microsoft-executive-briefing-center/50250806e4b0f1b43771a29d

Elle est longue, trop longue. Nous pouvons la raccourcir :

  • utiliser HTTP au lieu de HTTPS : vous serez de toutes façon redirigé vers l’application ou vers la version sécurisée de l’application web ;
  • retirer les www ;
  • retirer microsoft-executive-briefing-center, en effet, seul le code alphanumérique 50250806e4b0f1b43771a29d est nécessaire pour identifier le lieux.

Au final, nous obtenons l’adresse suivante : http://foursquare.com/v/50250806e4b0f1b43771a29d encore un peu longue, mais c’est déjà mieux.

Nouvelle méthode

Encore plus court et encore plus simple sur la page d’un lieu, il y a une adresse raccourcie fournie par Foursquare.

Adresse Microsoft

Générer le QR code

Comme je l’ai dit en début d’article, nous allons utiliser ce générateur : http://keremerkan.net/qr-code-and-2d-code-generator/

Générateur de QRcode

Les options de base sont correcte, les 3 choses à faire sont

  1. Renseigner l’URL Foursquare ;
  2. Sélectionner « medium-hi » comme en face de « error correction level »,
    « medium-low » suffit si vous ne comptez pas incorporer de logo au centre de l’image ;
  3. Presser le bouton « generate code« .

Et voila le résultat :

QRcode Microsoft

Créer l’afficher

Personnaliser le QR code

Je vais personnaliser le QR code à l’aide du logiciel Inkscape, le petit frère libre d’Illustrator,  mais vous pouvait utiliser n’importe quel logiciel de dessin vectoriel pour réaliser les opérations suivantes.

Importer le QR code

Inkscape : importer le QR code

Vectoriser le QR code

Cliquer sur « path » puis que « trace bitmap », dans la boîte de dialogue qui apparaît, régler les options comme elles sont affichées sur la copie d’écran ci-dessous :

Inkscape : menu vectoriser le bitmapInkscape : boîte de dialogue vectoriser le bitmap

Il en résulte un second QR code, aussi net que le premier, redimentionnable sans devenir flou ni pixeliser, sans fond et dont on peut choisir la couleur.

 Inkscape : QR code vectorisé

Donner un effet au QR code

Voici 4 exemples ce que l’on peut faire subir à un QR code sans qu’il ne perde de son efficacité.

Seule chose vraiment problématique, Le négatif, en effet tous les lecteurs ne permettent pas de lire un QR code dont le premier plan est plus sombre que le fond. Il existe toutefois des astuces pour en donner l’illusion, n’hésitez pas à me consulter pour d’autres effets plus complexes.

4 exemples de QR codes personnalisés

 

Ajouter un logo

Maintenant, nous allons ajouter le logo du Café Numérique au centre de l’image.

 QR code & logo

Modifier les repères

Vous aurez remarqué que malgré les modifications apporté au QR code, les repères, les 4 carrés ne changent pas.

Dans notre exemple, j’ai décidé de les remplacer par des ronds. Mais tout d’abord, supprimez les 3 gros repères carrés.

QR code sans repère        QR code avec repères ronds

En bref

  1. Importer le QR code ;
  2. Vectorier le QR code ;
  3. Modifier les tracets ;
  4. Ajouter un logo au centre ;
  5. Remplacer ou modifier les repères ;
  6. Exporter le QR code.

Récupérer le logo Foursquare

Vous pourrez récupérer le logo Foursquare à cette adresse : https://playfoursquare.s3.amazonaws.com/press/misc/windowcling.pdf

Résultat

Affiche Microsoft Foursquare Café Numérique Inscakpe & explication

 

Vous aussi vous êtes membre du Café Numérique et vous voulez réaliser ce type d’affiches, je peux vous fournir le fichier source vectoriel en SVG (universel) ou plus spécifique en EPS ou en PDF.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.