ICAN
OpenClassrooms
list 4 sequences
assignment Level : Introductive
chat_bubble_outline Language : French
card_giftcard 480 points
Users' reviews
4.8
starstarstarstar
Read review

Key information

credit_card Free access
verified_user Free certificate
timer 60 hours in total

About the content

Ce MOOC permet d’aborder via l'utilisation de Photoshop, le responsive design du point de vue du webdesigner !

Vous vous demandez comment concevoir un site web entièrement responsive, visible sur tous les écrans ? Je vous propose justement à travers ce cours d’aborder le responsive design du point de vue du webdesigner !

Nous verrons ensemble les grands principes du responsive design, et surtout comment les appliquer en créant 2 maquettes sous Photoshop d’une même page web : une version écran mobile et une version écran d’ordinateur. Nous utiliserons ensuite Bootstrap afin d’avoir un premier aperçu codé et fonctionnel de votre site responsive !

Pré-requis : il est conseillé d’avoir déjà des notions sur le fonctionnement de Photoshop et le langage HTML pour suivre ce cours.

more_horiz Read more
more_horiz Read less
dns

Syllabus

Partie 1 - Intégrez la notion de responsive design à vos projets

  • 1. Introduction au responsive design
  • 2. Les enjeux du responsive design
  • 3. Pensez "responsive design" !
  • 4. Structurez votre site avec des wireframes
  • 5. Créez vos wireframes avec Balsamiq
  • Quiz

Partie 2 - Maquettez la version "aperçu mobile" de votre site

  • 1. Utilisez Photoshop pour le responsive design
  • 2. Les outils de création de formes vectorielles
  • 3. La grille fluide
  • 4. Le design d’éléments d’interfaces
  • Quiz
  •  Activité : Concevez la maquette "aperçu mobile" de votre portfolio

Partie 3 - Maquettez la version "aperçu desktop" de votre site

  • 1. Profitez de l’espace
  • 2. Repensez l’ergonomie
  • 3. Adaptez vos éléments graphiques
  • 4. Enrichissez votre version "aperçu desktop"
  • Quiz
  • Activité : Concevez la maquette "aperçu desktop" de votre portfolio

Partie 4 - Intégrez votre maquette avec Bootstrap

  • 1. Introduction à Bootstrap
  • 2. Exportez vos éléments graphiques depuis Photoshop
  • 3. Intégrez vos éléments graphiques dans Bootstrap
  • Quiz
  • Activité : Créez un prototype responsive fonctionnel de votre portfolio

Certificat de réussite

 

record_voice_over

Intructors

Virak Mey

Virak Mey est responsable pédagogique du bachelor webdesign et communication graphique au sein de l’ICAN (Institut de Création et Animation Numérique) où il enseigne aussi le design numérique. Issu d’une formation en art appliqué et multimédia, Virak a travaillé en tant que directeur artistique web au sein d’agences parisiennes comme Publicis et Tbwa/Paris. Sa passion du design numérique l’a également amené à développer un véritable goût pour la transmission de son savoir dans ce domaine. En plus de son travail de pédagogue, Virak est également consultant en direction de création au sein de l’agence Creative Slashers.

store

Content designer

ICAN (Institute of creation and digital animation) is a college that trains computer graphics director combining technical expertise with the creativity of the designer.

INSTITUTE graduate specialized in the field of image and digital, school form three complementary specialties Infographic: Game Design, Digital Animation and Web and Graphic Design.

assistant

Platform

OpenClassrooms (formerly Le site du Zéro or SdZ) is a website that offers courses about computer science and entrepreneurship. Online courses can be made both by site staff, professors of universities or colleges partner as by its members.

Today, courses are available in several formats: MOOC (Massive Open Online Course), web text, e-book, book and video. The company delivers certifications for certain courses, including one recognized by the state in partnership with IESA multimedia.

Reviews
4.8 /5 Average
starstarstarstarstar
1
starstarstarstarstar
0
starstarstarstarstar
0
starstarstarstarstar
0
starstarstarstarstar
0
Content
4.5/5
Platform
5/5
Animation
5/5
Best review

Très simple d'accès et formateur.

Published on June 14, 2019
You are the designer of this MOOC?
What is your opinion on this resource ?
Content
0/5
Platform
0/5
Animation
0/5
on the June 14, 2019
starstarstarstar

Très simple d'accès et formateur.