Photos de profil dynamique pour les maquettes d'interface avec une interface utilisateur diversifiée

Lorsque vous concevez une maquette, vous voulez d'abord vous concentrer sur l'interface et moins sur l'esthétique. La même chose vaut pour le wireframing et le codage d'une mise en page Web à partir de zéro .

De nombreuses maquettes différentes nécessitent des photos de profil, telles que les réseaux sociaux, les commentaires de blog et les pages de profil. Avec l' interface utilisateur diversifiée, vous pouvez facilement intégrer ces photos dans votre maquette en quelques clics.

Le site vous permet de télécharger les photos sélectionnées ou de les intégrer directement via leur plugin Sketch .

Toutes ces images ont été soumises par de vrais utilisateurs avec l'approbation complète pour l'utilisation . Cela signifie que vous avez le droit de réutiliser ces photos pour des œuvres personnelles ou commerciales sans autorisation.

Divers UI fait en fait partie de la suite de plugins Craft, faite par InVision. Cela signifie que c'est le meilleur moteur pour trouver une large gamme de visages, peu importe ce dont vous avez besoin.

La raison pour laquelle j'aime cette collection, c'est qu'elle vient avec un accord de licence assez lâche qui devrait s'appliquer à toutes les œuvres, sauf les fins "maléfiques" (contenu diffamatoire ou haineux).

Les tailles d'image vont de 32px à 180px et vous pouvez modifier dynamiquement les images directement dans le navigateur. À partir de la page d'accueil, vous pouvez soit télécharger un fichier .zip de toutes les images, soit saisir celles que vous voulez en cliquant sur des photos individuelles.

Certes, je n'ai pas personnellement utilisé le plugin Sketch natif, mais il semble assez facile à mettre en place.

Pour en savoir plus sur le plugin, consultez le rapport officiel GitHub .

Et, si vous êtes à l'aise avec le codage, vous pouvez même extraire des images directement à partir de l'API, ce qui vous permet de saisir des images de profil par sexe ou par une quantité fixe d'images, tout au long de JavaScript.