Portfolio
Le site que vous êtes en train de voir actuellement
Le Défi
Créer un portfolio moderne permettant d'à la fois montrer mes compétences, mes projets, et la veille technologiques que j'ai mit en place.
L'éditeur et le stockage de donnée
Pour la première version de mon site, j'ai décidé de ne pas utiliser de méthode complexe et d'utiliser un format JSON pour stocker ma veille technologique et mon portfolio, une approche valide pour de petit volumes de donnée en lecture seule.
Étant donné qu'éditer une page de projet dans un fichier JSON est peu pratique, j'ai utiliser Claude code pour me créer un CRUD simple me permettant de visualiser le résultat final en temps réel.
UX
Pour l'ergonomie de mon site, j'ai décidé de me limiter à 3 pages principales et 2 pages secondaires, en effet, utiliser une unique "landing page" est ni pratique ni scallable et se limiter a un petit nombre de page permet de ne pas perdre l'utilisateur.
Design du site
Pour la direction artistique, j'ai pris inspiration du style Liquid Glass (Apple), qui combine l'aspect du verre dépoli avec la fluidité de l'eau. J'ai aussi utilisé des couleurs inspiré par le style Frutiger Aero.
<svg style="display: none">
<filter id="glass-distortion" x="0%" y="0%" width="100%" height="100%" filterUnits="objectBoundingBox">
<feTurbulence type="fractalNoise" baseFrequency="0.01 0.01" numOctaves="1" seed="5" result="turbulence" />
<feGaussianBlur in="turbulence" stdDeviation="3" result="softMap" />
<feSpecularLighting in="softMap" surfaceScale="5" specularConstant="1" specularExponent="100"
lighting-color="white" result="specLight">
<fePointLight x="-200" y="-200" z="300" />
</feSpecularLighting>
<feDisplacementMap in="SourceGraphic" in2="softMap" scale="150" xChannelSelector="R" yChannelSelector="G" />
</filter>
</svg>
Ce site - qui est le premier que je publie - m'a permis d'appliquer beaucoup des connaissances théoriques que j'ai emmagasiner durant ma formation. Cela me permettra de créer des projets plus complexes à l'avenir.