Openfile
FR

Pinmat

  • Nouveauté

Un portfolio d’une seule page disposé comme un bureau : une feuille de carnet, une note adhésive et des pin’s en émail que les visiteurs peuvent déplacer.

À propos de Pinmat

Votre travail sur une seule feuille de carnet, avec des pin’s qu’on a envie de déplacer.

Pinmat est un template Framer gratuit de portfolio pour un designer ou un créateur, disposé comme un bureau : une feuille de carnet lignée sur un tapis de découpe vert, avec une note adhésive pour les messages et des pin’s en émail que les visiteurs peuvent faire glisser. Ses 2 pages sont la page d’accueil, qui tient sur une seule page, et une page 404, avec toutes les rangées sur le CMS.

  • Un bureau qui se met en place tout seul

    Au chargement, la chemise glisse sur le tapis, les feuilles en sortent, les pinces se referment d’un coup sec, la note adhésive est plaquée et les pin’s sont enfoncés un par un.

  • Des pin’s qui bougent et qui parlent

    Six pin’s en émail aux bords dorés, avec un reflet lent, peuvent être glissés n’importe où. Chacun affiche sa propre infobulle façon étiqueteuse, comme « PSST. I MOVE. », et l’un d’eux est un pin’s photo pour votre portrait.

  • Des rangées venues du CMS

    Une seule collection Projets contient toutes les rangées : un nom, une description d’une ligne, un logo, un lien et sa section, Work, Projects ou Playground. Une nouvelle entrée, c’est une nouvelle ligne sur la feuille.

Conçu pour

  • Designers produit, UI et de marque
  • Développeurs et ingénieurs design qui ont des projets parallèles
  • Étudiants et personnes en recherche d’emploi qui veulent un CV dont on se souvient

Idéal pour

  • Designers qui veulent un portfolio qui a de la personnalité
  • Développeurs qui ont quelques produits et des projets parallèles
  • Étudiants et personnes en recherche d’emploi qui font un CV dont on se souvient

Ordinateur, tablette et mobile

La page d’accueil de Pinmat à chaque breakpoint, capturée sur le site publié. Chaque mise en page est conçue séparément, pas simplement réduite.

Ordinateur, 1440 pixels
Tablette, 810 pixels
Mobile, 390 pixels

Tout ce que contient Pinmat

Les pages sont listées d’après le plan du site publié.

Pages

2
  • Accueil
  • 404

Intégré

  • Pin’s déplaçablesSix pin’s en émail avec un peu d’inertie et un reflet en boucle, dont un pin’s photo
  • Curseur en émailUne flèche qui se change en main qui pointe, avec à côté l’infobulle façon étiqueteuse de chaque pin’s
  • Mise en placeChaque objet arrive comme il le ferait sur un vrai bureau, en trois secondes environ
  • Formulaire sur note adhésiveUn formulaire d’e-mail qui fonctionne, sur une note qui s’agite comme si un ventilateur soufflait dessus
  • MatGridUn composant de code qui ne dessine que des cases entières et peut dégager un bloc, comme sur la page 404
  • Réduction des animationsRespectée sur l’ensemble du site

Système de design

  • PolicesSpace Mono, Inter Display, Instrument Sans
  • Palette#FCFBFC#1E6846#E2CA7E#D9D7CD#869A77
  • Styles de couleur17
  • Styles de texte12
  • BreakpointsOrdinateur, tablette et mobile

Fourni avec

  • Le templateUn lien de remix Framer
  • Mises à jourÀ vie
  • Framer ProTrois mois sur un forfait annuel, quand vous publiez

Bon à savoir

  • Les rangées, les logos, le nom et le portrait sont ceux d’UV, montrés à titre d’exemple et à remplacer. Les rangées Find Me renvoient toutes vers openfile.pro.
  • Les images de partage et le favicon reprennent l’apparence de l’exemple : remplacez-les donc une fois que vous avez fait le site vôtre.

CMS

  • Projets8 entrées de départ

Ce que la licence vous permet

Gratuit

Gratuit

  • L’utiliser pour vos propres sites, y compris commerciaux.
  • L’utiliser pour des projets clients, dans le cadre d’un site que vous réalisez pour eux.
  • Tout y modifier.
  • Vendre, partager ou donner le template lui-même.
  • Le publier sur une autre place de marché ou un autre site de templates.
  • L’utiliser pour créer des templates ou des composants qui lui font concurrence.
  • Le présenter comme votre propre création originale.

Un résumé en termes simples. Le texte contractuel est celui des Community Terms de Framer, et la page licence explique les deux. Lire la licence

Avant d’acheter

Que comprend Pinmat ?

Le site entier sous forme de projet Framer : 2 pages, 1 collection CMS, mis en page pour ordinateur, tablette et mobile. Indiquez votre e-mail et le lien de remix vous y est envoyé ; Framer copie le site dans votre espace de travail.

Comment le personnaliser ?
  1. Remixez le template.
  2. Modifiez les rangées dans la collection Projets : le champ Section décide de la liste, et les logos rendent mieux en vignettes carrées.
  3. Changez le nom et le rôle dans l’en-tête de la feuille, et remplacez l’image du pin’s photo par la vôtre.
  4. Les pin’s, la note adhésive et les intitulés de section ont chacun une copie pour mobile et une copie pour les écrans plus grands : modifiez les deux.
  5. Faites pointer le formulaire de la note adhésive vers votre propre boîte de réception et les rangées Find Me vers vos profils, puis publiez.
Faut-il écrire du code ?

Non. Les textes, les images, les couleurs et les entrées du CMS se modifient directement dans l’éditeur Framer.

Puis-je l’utiliser sur plusieurs sites ?

La licence gratuite couvre vos propres sites et vos projets clients. La page licence en donne le détail.

Et si je suis bloqué ?

Écrivez à support@openfile.pro. Vous recevez une réponse sous 48 heures en semaine, et les questions de mise en place comme les bugs du template sont pris en charge.

Les visiteurs peuvent-ils vraiment déplacer les pin’s de Pinmat ?

Oui. Les six pin’s en émail se glissent n’importe où sur le bureau avec un peu d’inertie, grossissent légèrement au survol et à l’appui, et captent un reflet toutes les huit à dix secondes. Chacun a sa propre infobulle façon étiqueteuse à côté du curseur ; elle se masque pendant que l’on fait glisser le pin’s. L’un d’eux est un pin’s photo pour votre portrait.

Pinmat fonctionne-t-il sur mobile ?

Oui, aux largeurs ordinateur, tablette et mobile. Sur mobile, les pin’s se regroupent sous les rangées About et la note adhésive se place sous la liste. Les pin’s, la note et les intitulés de section y sont des copies distinctes, réservées au mobile : quand vous en modifiez une, modifiez aussi sa copie pour les écrans plus grands.

Puis-je utiliser le curseur habituel dans Pinmat ?

Oui. Le curseur en émail est défini sur le breakpoint ordinateur de chaque page : retirez-le à cet endroit et les visiteurs voient leur propre curseur. Les liens, les rangées, le bouton de la note et les pin’s le changent en main qui pointe ou en infobulle d’un pin’s.