Comment j'ai perdu 1000 $ sur un pixel

C'est l'histoire de la façon dont un client m'a fait perdre 1000 $ en déplaçant des choses de 1px. Cela a transformé ma carrière et je n'ai jamais demandé à parier l'argent. Cela m'a également appris comment le développement Web se transforme et nous pouvons nous adapter à ces changements.

À l'époque, je dirigeais une agence de médias sociaux. En plus de gérer des comptes de médias sociaux avec un système interne de pointe, nous organisions également des concours et créions de petites applications marketing pour nos clients.

Parfois, un client venait sans aucune idée, alors nous concevions une application à partir de zéro. Rarement nous avions des clients qui venaient avec des conceptions prêtes pour une application marketing à développer.

Habituellement, ce que je faisais était de suivre vaguement la conception pour s'adapter au budget du client. Tout le monde était content, les concours ont été couronnés de succès et ont donné à nos clients beaucoup de nouveaux abonnés et une large notoriété de la marque.

C'était le début des médias sociaux, et c'était assez facile par rapport à la façon dont il est maintenant d'atteindre les clients avec des activités organiques.

Donc, ma vie de développeur web était assez confortable. Jusqu'à ce qu'un client arrive. Il ne voulait pas de concours. Il voulait avoir une page d'abonnement à la newsletter sur son compte de réseau social.

Je ne mentionnerai pas le nom de la plate-forme de médias sociaux, mais à l'époque, elle était capable de créer une sous-page sur votre page de médias sociaux avec HTML, CSS et JS.

Le budget que j'ai négocié pour la tâche était raisonnable ; le client l'a accepté. J'ai eu assez de temps pour exécuter la commande sans hâte.

Ai-je oublié de mentionner? Il est venu avec son propre design pour la page de la newsletter. C'était beau et accrocheur, dépassant en milles ce qu'était l'idée des applications marketing à l'époque.

Pour moi, cela a facilité la tâche car je n'avais qu'à composer la page et passer à d'autres tâches. Après deux jours mélangés à d'autres tâches, j'ai terminé la page de destination et l'ai envoyée au client satisfait des résultats.

Mais le client ne partageait pas mon enthousiasme. Il m'a dit que la page de destination différait de la conception. Eh bien, il l'a fait. Le design n'était qu'une inspiration, et j'ai juste tout placé plus ou moins au bon endroit.

J'ai pensé, ok, je vais juste l'ajuster davantage. Déplacer un bouton vers la gauche, image en haut, etc. C'était assez habituel pour moi, car souvent, même en faisant une solution parfaite, certains clients demandaient des changements.

C'est une étape naturelle et importante car elle donne au client un sentiment de participation et de satisfaction d'avoir quelque chose qu'il veut.

Après quelques jours de plus, j'ai ajusté la page d'accueil de la newsletter et l'ai envoyée au client. Au bout d'une heure, j'ai reçu une réponse: "C'est toujours faussé."

C'était décevant pour moi, car la mise en œuvre était * presque * une représentation parfaite de la conception fournie, et j'ai manqué de budget pour ce projet.

C'est à ce moment-là que j'ai décidé de faire une capture d'écran de l'implémentation et de la superposer sur la conception de l'application Paint.NET. Ce qu'il a révélé, c'est que même si la mise en œuvre était similaire à la conception, les éléments étaient à des pixels de la conception dans différentes directions.

Jusqu'à ce stade de ma vie, j'étais plutôt content de ne pas voir de différences de pixels. J'étais frustré. Mais je voulais vraiment terminer cette tâche que j'ai prise. J'ai donc travaillé plus avant sur ce projet. Au total, j'ai dépassé le budget de 300 $ en travaillant plusieurs heures supplémentaires.

Cette fois, je choisis une approche différente. Je n'ai pas essayé d'ajuster l'implémentation. Je viens de déplacer des éléments pour qu'ils correspondent à 100% à la conception de Paint.NET. C'était ma première implémentation au pixel près.

Dans ma tête, je luttais entre « ça n'a pas de sens » et « essayons ça ». Enfin, j'ai pu envoyer la nouvelle version au client. Une fois le pixel parfait, le client a accepté le résultat.

J'avais l'intention de passer immédiatement à la tâche suivante, mais j'étais curieux. Quelle était la différence ? J'ai ouvert deux applications Paint.NET côte à côte pour comparer ma première implémentation et celle au pixel près.

Ce que mon œil d'ingénieur plutôt éclectique a vu était étonnant. Ma mise en œuvre initiale avait l'air moche! Je ne l'avais jamais vu auparavant et je pensais que ces 2 à 3 pixels de différence n'avaient pas d'impact sur la perception. Mais j'étais là, regardant la newsletter Mona Lisa d'un mauvais œil.

Je voulais initialement facturer le client pour ce non-sens avec des pixels. Cependant, compte tenu du fait que je venais d'apprendre quelque chose d'extrêmement important, je lui ai juste facturé un tarif de base.

Ce moment et ce client ont cimenté ma transformation de développeur front-end en développeur design. Depuis ce temps, j'ai travaillé avec de nombreux designers, clients et développeurs front-end.

Tout le monde ne s'attend pas à des implémentations parfaites au pixel près. Ce n'est pas toujours nécessaire et pas toujours judicieux financièrement. Mais parfois, c'est le cas, surtout lorsque vous voulez attirer des clients.

Les bons designs attirent les yeux des gens. Les bons designs se cachent dans ce 1px que vous avez ajouté à votre feuille CSS.

Pour pouvoir vous concentrer sur de telles questions, vous devez régler les aspects techniques de votre logiciel. Pour que plus d'efforts puissent être consacrés aux aspects marketing, commerciaux et d'expérience de votre boutique ou application de commerce électronique.

C'est pourquoi j'aime ce que propose Elastic Path . C'est une entreprise qui sponsorise le concours auquel je participe avec cet article. Ils offrent toutes les fonctionnalités opérationnelles dont vous avez besoin pour mettre en place plusieurs sites e-commerce.

En tant que développeur, j'adore l'idée car je me concentre plutôt sur les besoins de l'entreprise que sur la maintenance et le développement de catalogues de produits, de systèmes de paiement, etc. Ils offrent une API facile à utiliser que vous pouvez simplement exploiter dans votre nouveau lieu de commerce électronique. .

Si vous aimez l'article, veuillez cliquer sur l'icône du cœur, commenter et partager sur les réseaux sociaux. Acclamations!