14 mars 2021 Jour 22 - Set up du projet et Landing page

Ça y est, la phase de préparation est terminée, je peux enfin me lancer dans le code ! Il reste un peu moins de 80 jours pour tout terminer.

Pour rappel, je suis en train de créer un SaaS en maximum 100 jours. Pour en savoir plus sur les raisons de ce challenge, ça se passe dans le Jour 0, et pour comprendre le projet que je suis en train de développer, rendez-vous en Jour 1

Ça y est, la phase de préparation est terminée, je peux enfin me lancer dans le code ! Il reste un peu moins de 80 jours pour tout terminer.

L'objectif de ce blog n'est pas de rentrer dans les détails techniques, je vais donc essayer de garder le contenu des articles assez général concernant les choix que je suis amené à faire, les librairies utilisées pour gagner du temps etc. Donc même si vous ne travaillez pas avec les mêmes technos que moi, vous devriez tout de même pouvoir suivre l'avancement.

Set up du projet

Comme je l'expliquais dans le Jour 16, j'utilise Laravel comme framework principal. J'ai donc commencé par initialiser un nouveau projet Laravel avec composer, et créé le repository git sur Gitlab.

L'étape suivante a été d'ajouter Laravel Breeze, qui est un starter pack pour gérer tout ce qui est authentification. En quelques clics, j'ai donc déjà un projet avec un layout de base, la gestion de l'inscription, du login et des emails de reset password. Tout cela sera un peu customisé par la suite, mais ça permet de démarrer très rapidement sans perdre de temps sur ce qui n'apporte aucune valeur au projet.

L'avantage de Laravel Breeze est qu'il configure également toute la partie frontend en utilisant tailwindcss (ça tombe bien, c'est ce que je veux utiliser). Je gagne donc encore une fois un peu de temps car tout le setup est fait pour moi.

Et voila en 5 minutes, le set up de base est terminé, et le site est accessible en local, je peux commencer à travailler sur la landing page.

La landing page

Avant de développer tout le projet, je commence par créer uniquement une landing page. Comme je l'expliquais dans un article précédent, cette landing page va avoir deux objectifs

  • Commencer à récolter des emails de personnes intéressées par la plateforme, pour les contacter le jour du lancement (mais sans pour autant investir trop de temps dans la promotion de cette landing page)
  • Commencer la procédure d'acceptation de Paddle (qui va gérer les paiements)

L'investissement en temps sur cette landing page ne doit pas être trop élevé pour le moment, je pourrai la retravailler un peu avant le lancement si nécessaire (et si il me reste du temps).

Généralement je préfère les landing pages montrant des screenshots de l'application. Je trouve que cela permet d'avoir une bonne idée de ce à quoi on va avoir accès, avant même de s'inscrire. J'ai donc pour habitude, lorsque je liste les fonctionnalités, d'associer chacune avec une screenshot la mettant en avant.

Le projet n'étant pas encore développé, je n'ai pas encore la possibilité de faire ces screenshots pour le moment. Je n'ai pas non plus envie de passer du temps à faire des mockups. Je me suis donc contenté de quelques illustrations à la place de screenshots. Pour ces illustrations, j'ai utilisé undraw.

Ensuite, j'ai utilisé un logo temporaire, ayant commandé tout récemment le logo à mon designer habituel, je devrais recevoir cela prochainement.

La page est déjà en ligne, pour voir l'aperçu, ça se passe ici: https://www.upcoming.link

J'ai divisé ma landing page en plusieurs sections:

  • Le 'hero', donc le haut de la page que tout le monde verra en arrivant. Composé de la phrase d'accroche en essayant d'expliquer le plus clairement possible la valeur que j'apporte (Get more streams and saves on release day), et d'un screenshot d'une page de campagne. C'est la seule autre page que j'ai déjà codé afin de pouvoir montrer cet aperçu, qui me parait important pour faire comprendre directement en quoi consiste le projet. Pour cette campagne, j'ai utilisé un morceau qui cartonne dans les classements actuellement, en me disant que ça donnerait une meilleure impression qu'un artwork d'un morceau inconnu.
  • Les stats, en indiquant que je m'adresse à la fois aux artistes et aux labels. Les nombres sont pour le moment bidons, mais seront mis à jour dès que quelques campagnes auront réellement été lancées.
  • Les fonctionnalités. J'ai séparé cela en 2 parties, la première pour illustrer comment cela permet d'augmenter l'engagement des fans, et la seconde pour introduire les analytics avancées, qui pourront me différencier des concurrents. J'ai volontairement peu détaillé les fonctionnalités pour le moment et retravaillerai cela dans le futur. Je compte également par après créer 2 landing pages plus spécifiques pour chaque segment de client.
  • Les prix. C'est assez rare de déjà voir les prix dans une landing page 'coming soon', mais j'ai choisi d'être tout à fait transparent dès le début. La fourchette de prix allant de 0 à 100€, je pense que ça ne devrait pas bloquer ceux qui ont intéressés.

Ensuite il ne me restait plus qu'à configurer le serveur et déployer cette première version. Ca y est, la Landing page est en ligne après 22 jours !

Envie de suivre l'avancement du projet ?

Abonnez-vous à pour recevoir toutes les infos chaque semaine.