Der Design Studio

Catégorie : Frontend

  • Top newsletters pour les frontend designers

    Top newsletters pour les frontend designers

    Hello les Frontend Designers Créatifs, je vous présente les deux newsletters incontournables pour rester aux tendances https://css-weekly.com et — https://frontendfoc.us . Voici les thématiques générales: Ressources css, UI, Inspirations Actualités frontend, Articles techniques, etc…

  • Comment rendre un player responsive avec du css (vidéo)

    Code source

    .videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
}
.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

  • Inline vs Block

    Ce qui va vous aider à mieux cerner le css c’est de savoir la différence entre une balise de type inline et une balise de type block.

    Regarder la vidéo https://youtu.be/Bexu23GgFP0

  • Qu’est-ce que c’est un Frontend Designer

    C’est quoi un Frontend Designer ?

    Un frontend designer est un profil qui:

    • a de solide base en UX,
    • est Web designer,
    • maitrise html/css et un CMS (Drupal ou WordPress).

    Il est capable de piloter un projet web de A à Z. Il est indépendant.

    Alors comment faire pour devenir un frontend designer ?

    • Se document sur l’univers sur ux design (blog, vidéos, podcast)
    • Connaitre les concepts suivants:
      • Recherche Utilisateur (User research)
      • Persona
      • User Flow
      • Journey Map
      • Wireframe
      • Mockup (Maquette)
      • User Testing
    • Apprendre le html, css, un peu de jQuery (lol)
      • Apprendre le sass/scss
      • Connaitre quelques outils comme Gulp, Grunt, Yeoman, Composer
      • Maitriser quelque framework css (Foundation, Bootsrap, Tailwind CSS, etc)
      • Connaitre les méthodologies en css: BEM, SMACSS, OOCSS
      • Responsive css
      • Mobile first
    • Pratique le web design
      • Fonts
      • Couleurs
      • Contrastre
      • Consistance
      • Designer des composants (boutons, form, header, card, footer, tabs, etc)
      • Ui kits, design système
      • Se ressourcer sur Behance, Dribbble, Pinterest
    • Apprendre à créer des thèmes Drupal ou WordPress etc…

    Source: https://bradfrost.com/blog/post/frontend-design/