Vous avez donc décidé de concevoir et de développer vous-même un portefeuille personnel. C'est génial! Vous êtes bien en avance sur la moitié des concepteurs et développeurs de sites Web. Mais qu'en est-il des 50% restants? Vous devez faire preuve de compétences exclusives dans un espace réduit pour pouvoir briller dans ce secteur en pleine croissance.
Au cours des trois dernières semaines, depuis que j'ai pris cette décision, j'ai beaucoup appris sur la création d'un portefeuille unique. Maintenant, j'estime qu'il est temps de partager avec vous ces connaissances nouvellement acquises.
Ce que j'ai découvert après ces 3 semaines est un portfolio inspiré du jeu.
Semaine 1: Cherchez au-delà de ce que vous voyez
Au moins une fois tous les six mois, une nouvelle tendance Web est née. Il est si difficile de suivre toutes ces tendances, quel que soit le nombre de blogs et de développeurs que vous suivez sur vos réseaux sociaux. Sites Web à une page, parallaxe, curseurs, design minimaliste, etc.? La liste des tendances du Web est interminable et nous pourrions continuer à les compter toute la journée.
Donc, la première chose que vous allez faire est un court projet de recherche sur ce qui est? In? en ce qui concerne les tendances de la conception et du développement Web. Une bonne chose à propos de ce type de recherche est que vous avez des idées et peut-être un avant-projet de ce que votre portefeuille devrait être. Le problème est que cela peut vous amener à sceller votre esprit à la créativité et à vos propres idées novatrices.
Une chose importante à ne pas oublier cette semaine est d'écrire tout votre matériel de marketing. Je pense que c’est l’une des parties les plus difficiles à traiter. Il n’est pas facile d’écrire ce qui pourrait fondamentalement déterminer si un client vous contactera ou non. Ecrivez-le sur papier et posez-vous la question suivante: "Si j'étais un client potentiel, qu'est-ce qui me ferait me contacter?"
N'oubliez pas que ce portfolio vous présentera au monde entier. Vous devez proposer des idées originales, une pensée novatrice et un concept de portefeuille qui épatera les gens.
Ce que j’ai trouvé après la première semaine était une décision: «Même si ce sera difficile, je vais développer moi-même un jeu Web basé sur une programmation front-end». Trois semaines était le temps que je me suis donné pour le faire?
Semaine n ° 2: coder comme s'il n'y avait pas de lendemain
Une fois que vous avez eu une idée de base, et pas un instant avant, il est temps de commencer à penser à la phase de développement.
J'ai décidé que mon portfolio serait fonctionnel en tant que jeu basé sur le Web. J'ai donc commencé à rechercher des frameworks JavaScript qui pourraient m'aider à gagner du temps et de gagner du temps. Le problème avec les frameworks est qu’ils seront généralement bons pour l’initiative, mais qu’ils ne répondent pas à vos besoins à long terme.
Un bon exemple dans mon portefeuille est constitué par les boîtes à lumière qui fournissent des informations sur moi et sont activées lorsqu'un utilisateur entre dans une maison. Ce type de fonctionnalité n'existe pas sur un moteur de jeu JS classique.
Maintenant, il existe toujours une option pour prendre un framework existant et l’améliorer en ajoutant votre propre code, mais considérez que parfois, plonger dans du code de quelqu'un prend plus de temps que d’écrire le vôtre. De plus, si vous réécriviez le code de quelqu'un d'autre, cela pourrait poser un problème pour les nouvelles versions.
Après avoir passé en revue quelques frameworks de moteur de jeu, je me suis dit que je n'avais pas d'autre choix que de construire mon propre moteur de jeu qui conviendrait à mes besoins.
Prenons un aperçu rapide des principales méthodes que je mets en place dans le jeu.
Pour gérer les événements clavier des flèches, j'ai utilisé le code suivant:
Comme vous pouvez le constater, le code est très simple. Si l'utilisateur appuie sur le bouton? Up? ou? Down? les flèches j'appelle le? moveY? fonction, et en cas de? ou? gauche? J'appelle? MoveX? une fonction.
Un rapide coup d’œil sur l’un d’eux révélera où toute la magie se produit:
Pour chaque étape utilisateur, je vérifie avec une méthode spéciale appelée? CanImove? (Puis-je me déplacer?) Si le personnage peut se déplacer sur la toile de jeu. Cette méthode inclut les limites d’écran, les positions des maisons, les routes, etc. Si c'est le cas, je retourne Vrai et le personnage continue à se déplacer, sinon je retourne Faux et le personnage reste à sa position actuelle.
Maintenant, comme nous parlons encore du Web, j’ai pensé qu’il ne suffisait pas de bouger avec les flèches du clavier. Vous devez toujours penser à l'utilisateur final - votre client potentiel qui n'a peut-être pas le temps de "traîner dans votre monde". C'est pourquoi j'ai ajouté une barre de navigation et une option pour? Téléporter? le personnage directement à un point spécifique du jeu.
Le? Téléport? méthode ressemble à ceci:
Je reçois le? X? Andy? paramètres de l'événement clic de souris avec? event.pageX? et? event.pageY ?, après avoir les deux, je change de joueur CSS? reste? et? top? propriétés et utiliser le jQuery? animate? méthode pour animer l'opacité du joueur - afin que je puisse créer le? Fade? effet.
Un bon conseil que je peux vous dire, malheureusement, j’ai appris à la dure, est de garder votre code aussi dynamique que possible. Écrivez le code de telle sorte que si vous souhaitez ajouter plus de contenu à votre portefeuille ultérieurement, votre code le supportera.
Semaine n ° 3: Les commentaires sont votre nouveau meilleur ami
La dernière semaine de développement de mon portefeuille a été très délicate. Je devais fermer les touches de conception finale et coder tout en me battant pour ne pas le publier déjà. C'était comme garder un secret que vous n'êtes pas sûr que c'est complètement vrai.
J'ai trouvé une solution à cette contradiction agaçante. Prenez dix personnes que vous connaissez et en qui vous avez confiance, montrez-leur votre travail et demandez-leur leur avis. De préférence, ces dix personnes devraient être complètement différentes les unes des autres. Voici les dix personnes que j'ai choisies pour cette mission top secrète:
- Ma mère
- Mon patron
- Mon meilleur ami
- Mon neveu de 6 ans
- Un concepteur web senior
- Un développeur front-end senior
- Un client potentiel
- Un client avec qui j'ai travaillé
- Un ingénieur en assurance qualité
- Un autre développeur web super-multi-ninja (juste au cas où)
Demandez-leur de vous faire part de leurs commentaires. À partir de ta mère, ça te dit que ça ne marche pas sur mon ordinateur! (Eh bien, vous utilisez IE5.5?) Qui vous rappelle que vous devez écrire des solutions de rechange pour IE, à votre neveu de 6 ans, qui peut vous donner un test d’utilisabilité gratuit, et enfin à votre patron et à? ninja développeur web? qui vous donnera une révision minutieuse du code de détail qui peut vous aider à améliorer votre code et à le rendre encore plus efficace.
Vous n'avez aucune idée du nombre de commentaires positifs sur les changements que vous pouvez obtenir. S'en tenir à cela.
Conclusion
Développer un portefeuille personnel n’est certes pas une tâche facile, mais cela en vaut la peine. J'ai beaucoup appris de ce processus et obtenu de très bons commentaires.
Prenez le temps et pensez à votre propre et unique? Époustouflant? Si vous avez une idée de votre portefeuille, n'hésitez pas à consulter d’autres personnes à propos de la conception, des interfaces utilisateur et des problèmes de marketing, et vous vous souvenez toujours de l’essentiel? s'amuser!