Plan du site  
français  English
pixel

Blog du campus SUPINFO Reims

Design & Webdesign

Publié le 2 mai 2016 dans Actualités

Le design est un processus de collecte d’idées, de leur implémentation et de leur organisation d’un point de vue esthétique. Ce processus est guidé par certains principes qui peuvent varier selon l’objectif ou le domaine d’application.

img

Qu’est-ce que le Webdesign ?

Le webdesign est un processus similaire qui a pour but la création de contenus structurés au sein de pages web. Cela inclut notamment l’architecture de l’information, l’interface avec l’utilisateur, la structure du site web, la navigation, la mise en page, les couleurs, les polices et les images.

« Design is a part of Webdesign »

Le design est un élément clé dans la conception d’un site web. Il inclut à la fois les grands principes de conception : l’équilibre, le mouvement, le contraste et l’unité ainsi que les éléments nécessaires au design : les lignes, les formes, les textures, la couleur… C’est en associant tous ces items qu’un web designer créé un site web.

Les rôles du Webdesign

En plus de ces aspects purement artistiques, le webdesign se construit également par la connaissance d’un certain nombre d’autres domaines : les langages de programmation, l’architecture de l’information, le référencement, la stratégie web, le marketing…

La plupart des concepteurs font l’erreur de ne pas chercher à couvrir l’ensemble de ce spectre. Ils se concentrent souvent sur un ou deux domaines dans lesquels ils excellent et délèguent à d’autres pour le reste. Si l’on souhaite réellement designer un site web de A à Z, il est pourtant nécessaire de connaître et de travailler l’ensemble de ces points.

Les éléments du Webdesign

Comme écrit précédemment, il est à noter que le webdesign reprend la plupart des codes et éléments visuels du design « classique » :

  • La mise en page : l’agencement des éléments graphiques, des pubs, des textes. Dans le monde du web, l’un des enjeux majeurs est de permettre à l’utilisateur de trouver en un coup d’œil les informations qu’il recherche.
  • La couleur : le choix des couleurs dépend de l’objectif, de la vision du propriétaire du site. Les 216 couleurs garanties pour le web sont toujours à utiliser de préférence.
    https://websafecolors.info/color-chart
  • Les éléments graphiques : logos, photos, cliparts ou icônes, tout ce qui peut égayer le design d’un site. Ces éléments doivent être agencés de façon appropriée, en parfaite adéquation avec les couleurs et le contenu, et en veillant bien évidemment à ne pas surcharger la page.
  • Les polices : l’utilisation de différentes polices peut améliorer l’ergonomie d’un site web. La plupart des navigateurs ne prennent en charge qu’un certain nombre de polices, appelées « web safe fonts ». Il est d’usage, en tant que concepteur, de ne travailler exclusivement qu’avec ce groupe de polices.
    http://www.cssfontstack.com/
  • Le contenu texte : le contenu et les autres éléments de design doivent être travaillés ensemble pour permettre de rendre le « message » du site clair et facilement compréhensible. Le texte doit être pertinent et utile, le but est de ne pas brouiller l’utilisateur et faire en sorte qu’il reste sur le site. Le contenu doit être optimisé pour les moteurs de recherche et incorporer des mots clés pertinents.

Un aspect plus poussé du webdesign, à savoir la création d’une interface «user centric» n’étant pas abordé dans cet article, il pourrait être intéressant d’en faire l’objet d’une recherche personnelle pour approfondir le sujet :).

Thomas JOSEPH – Etudiant en Bachelor SUPINFO à Reims

Continuer à lire Design & Webdesign

Des jeux vidéo avec Unity 3D

Publié le 26 avril 2016 dans Actualités

Avec Unity 3D qui est un moteur de jeu, vous pourrez créer votre jeu 2D ou 3D, en commençant par des jeux basiques jusqu’à des jeux triple A si vous avez la motivation.

$logo-titled

Simplicité et efficacité

Vous pouvez créer avec facilité vos projets avec l’interface d’Unity 3D ainsi que les scripts appliqués sur les objets instanciés par le moteur de jeu, vous pouvez le rendre hautement optimisé et beau grâce à ces scripts c#, Javascript ou Boo (langage propre d’Unity).

Vous pouvez déployer votre projet en un clic sur plusieurs plates-formes tel que PC, Linux, Mac, ps3, ps4, Android, iPhone, Xbox, et bien d’autres.

La valeur ajoutée d’Unity pour le développement

De plus, vous pouvez utiliser des services intégrés de Unity pour accélérer votre processus de développement, et optimiser votre projet, et aussi partager vos créations via le market intégré d’Unity où l’on peut trouver beaucoup de ressources, même gratuites.

Ce moteur de jeu est gratuit pour les utilisations non commerciales et les utilisations commerciales qui génèrent moins de 100 000€ de revenus par an.

En résumé, Unity 3d est essentiellement un concepteur de jeux vidéos qui instancie des objets en leur appliquant des scripts pensés par le programmeur qui rendront un jeu fini. Certains jeux connus sont sortis sous ce moteur tel que Borderlands ou Rust.

Erwan Locart – Etudiant en Bachelor SUPINFO à Reims

Continuer à lire Des jeux vidéo avec Unity 3D

On a tous joué au moins une fois dans notre vie à un jeu vidéo. Mais qu’en est-il de sa conception ? Des simples jeux sur mobiles, aux grosses productions tournant sur des machines conçues pour, le schéma est quasiment le même.

jeux vidéos reims

1 – La phase de pré-production

Dans un premier temps, la phase de pré-production. L’idée est de définir la viabilité de notre projet. Dans le jeu vidéo il s’agit d’une étape critique qui consiste majoritairement en 3 points :

  • Choix des éléments de base du Game design
  • Choix du prototype de gameplay ainsi que des technologies
  • Moyen de financement et planning d’élaboration

A partir de là, on sait si l’on continue le projet ou non. Les projets s’arrêtant à cette étape de pré-production sont dits tués (ou « killed » en anglais)

2 – La phase de production

Si le projet est viable, on peut procéder à la phase de production. Pour cela, on s’aidera d’un document appelé « bible de production du jeu » qui contiendra tous les détails du projet. Durant la production, un point sera fait avec l’éditeur afin de savoir si le planning est respecté.

3 – La phase de test

Une fois le projet terminé, Il faudra procéder à plusieurs tests minutieux afin d’éliminer les nombreux bugs et ainsi peaufiner le jeu. Pour cela, on fait appel en général à des testeurs, mais aussi à l’éditeur pour la charte qualité. Le public peut éventuellement participer à la phase de test, bien que ce ne soit pas obligatoire.

4 – La distribution

Cette phase est gérée par l’éditeur qui utilisera son réseau pour distribuer le jeu dans les chaines de magasin.

5 – Après-Vente

En raison de l’existence de bugs restants, on peut être amené à faire des mises à jour (« patch ») afin de les corriger. Il est aussi possible de proposer des add-on (ou DLC) pour le jeu initial : niveaux supplémentaires, items, etc…

Au final, bien qu’ il y existe un projet unique pour chaque production, les étapes restent les mêmes et sont essentielles à la réussite de ce projet.

Fitia Rakotomahanina – Etudiant en Bachelor à Reims

Continuer à lire Les phases d’élaboration d’un jeu vidéo

Sortie de Windows Phone 10

Publié le 11 avril 2016 dans Actualités

Déjà disponible en Preview et sur certain Nokia Lumia, Windows Phone 10 annonce un prochain déploiement sur les smartphones commercialisés avec Windows Phone 8.1.

wp10

Les principales nouveautés

Windows Phone 10 embarque la version 2016 de la suite office pour mobile.

Le centre de notification offre la possibilité de s’agrandir pour atteindre tous les raccourcis utiles qui ne pouvaient pas s’afficher sur les quatre emplacements de l’ancien OS. En outre, les notifications pourront être synchronisées sur plusieurs appareils Windows.

qsdf

Le désordre du menu des paramètres qui pénalisait les utilisateurs des anciennes versions a lui aussi été revu pour un bien meilleur rangement. Ainsi, chaque réglage sera rangé en sous-catégorie.

Les applications récemment installées sont placées temporairement en haut de liste et sont accompagnées de la mention « Nouveau ».

Tout comme Windows 10, la version mobile passe d’Internet Explorer à Edge en intégrant un mode lecture.

L’écran multitâche peut accueillir plusieurs tâches sur le même écran. Pratique pour les utilisateurs qui jonglent avec leurs applications.

Le nouveau système d’exploitation se dote d’un explorateur de fichiers intégré. S’il s’avère ergonomique et pratique d’utilisation, on peut donc se passer d’une application tierce.

De façon plus générale, le nouveau produit de Microsoft est plus orienté vers le Cloud que son prédécesseur. En effet, Cortana, les documents Office et les notifications ont la possibilité de se synchroniser sur d’autres dispositifs Windows.

Les modalités de sortie

Initialement prévue en deux phases (les mobiles entrées de gamme puis les hauts de gamme), sa sortie se fera en plusieurs étapes. Une liste de mobiles éligibles est disponible, mais est toujours susceptible d’être modifiée puisque non-définitive. Elle s’agrémentera donc d’autres appareils au fur et à mesure. Enfin, Microsoft s’avère plutôt discret en ce qui concerne les dates de sorties.

Le nouveau système se veut innovant, proposant de nombreuses fonctionnalités supplémentaires ou améliorées, mais Microsoft qui avait prédit la sortie en Février commence à impatienter les propriétaires de mobile Windows et se veut très timide concernant les précisions sur le sujet.

Vincent Sylvestre – Etudiant en Bachelor à Reims

Continuer à lire Sortie de Windows Phone 10

AngularJs : qu’est-ce que c’est ?

Publié le 4 avril 2016 dans Actualités

AngularJs est un framework javascript développé par Google. Créé en 2009, la version 1.5.0 est sortie en février 2016.La principale caractéristique d’AngularJs est l’utilisation du patron d’architecture MVC. Celui-ci permet de séparer la logique « métier » de notre application de la mise à jour des éléments affichés (DOM)…

AngularJS

Le logo d’AngularJs

On construit une application AngularJs en ajoutant des balises html particulières qui vont nous permettre d’interagir avec le framework. La balise la plus représentative de ce fonctionnement est la balise « ng-model » que l’on va généralement utiliser sur un champ de saisie html.

Cette balise permet de créer un « Two way data binding ». Lorsqu’on modifie la variable dans le code javascript, la valeur du champ va être mise à jour automatiquement et inversement : lorsqu’on modifie la valeur du champ, ceci affectera immédiatement la valeur de la variable dans le code javascript. Ceci permet de s’affranchir des opérations de validation des saisies et de mises à jour de l’affichage afin de se concentrer sur l’essentiel de notre application.

Pour en savoir plus et créer votre propre application avec AngularJS je vous recommande ce tutoriel interactif de codeschool.

L’inscription est obligatoire mais gratuite et vaut vraiment le coup, bon courage !

Karim Makhloufi – Etudiant en Master 2 à Reims

Continuer à lire AngularJs : qu’est-ce que c’est ?

Nouvelle version majeure de PHP.

Publié le 11 mai 2015 dans Actualités

J’ai eu la chance d’assister hier soir à une conférence sur PHP7​ qui sera disponible en novembre cette année !

Non, vous n’avez pas loupé un épisode : PHP passe directement de la version 5 à la version 7 à cause de soucis dans le développement de la version 6.

Voici ce que j’en ai retenu :

Le Zend Engine (qui interprète le langage PHP) en cours de développement et qui sortira pour la nouvelle version de PHP affiche d’ores et déjà un gain de performances significatif. En effet, en moyenne 50% de charge processeur et d’utilisation de mémoire vive en moins sont constatés par rapport à la version actuelle. Ce gain énorme permettrait en théorie de réduire par deux le nombre de serveurs nécessaires pour une architecture passant de PHP 5 à PHP 7 !

Comme je l’avais prédit l’année dernière dans ce billet, PHP7 permettra d’ajouter du typage statique aux fonctions. Ceci permettant une plus grande rigueur et un meilleur contrôle des données manipulées. Cependant, le typage reste par défaut dynamique afin de conserver la souplesse du langage.

Un nouvel opérateur appelé « Spaceship Operator » et noté « <=> » fait son apparition et facilitera les comparaisons. Son but premier est d’alléger la syntaxe des algorithmes de tri.

Vivement l’hiver !

Karim Makhloufi

Continuer à lire Nouvelle version majeure de PHP.

Les bornes d’arcade rétro du BDE.

Publié le 15 avril 2015 dans Actualités

Les aéroports suédois ont eu une idée originale pour aider la croix-rouge : installer des bornes d’arcade rétro et leur reverser l’argent obtenu.

sweden-airports-charity-arcade-exlarge-169.jpg​

Vous pouvez lire un article qui présente le projet de façon plus complète ici : http://edition.cnn.com/2015/03/24/travel/sweden-spare-currency-arcade/

Inspirés par cette initiative, le BDE à décidé de faire la même chose à SUPINFO Reims ! Entre deux cours les étudiants pourront s’affronter sur un jeu de combat rétro ou tenter de battre le high score d’un puzzle game tout en effectuant une bonne action.

Une fois le projet terminé, nous espérons être imités par d’autres campus SUPINFO et pourquoi pas, d’autres écoles voire entreprises. C’est pourquoi nous diffuserons les plans et logiciels utilisés.

Un concept est d’ores et déjà fonctionnel et les démarches de financement on été entamées auprès de différentes entreprises locales, il ne nous reste plus qu’à régler quelques détails avant de se lancer dans le vif du sujet !

Vous pourrez suivre sur ce blog étape par étape l’avancée de cette aventure

A très vite !

Le BDE

Continuer à lire Les bornes d’arcade rétro du BDE.

2014-11-22 15.05.31Les étudiants de SUPINFO REIMS promotion 2012/2013 viennent de vivre, ce samedi 22 novembre, un événement important dans leur vie d’étudiant : leur remise des diplômes (organisée par Reims Métropole). A cette occasion, tous les MASTER de Reims étaient réunis. Pus de 500 étudiants mis à l’honneur! L’élite de demain!!

 

Continuer à lire La remise des diplômes 2014 organisée par Reims Métropole.

Semaine de l’entrepreneuriat

Publié le 20 novembre 2014 dans Actualités

Du 17 au 22 novembre 2014, de nombreux événements seront organisés pour sensibiliser et accompagner l’entrepreneuriat étudiant. Tout pour stimuler l’esprit d’entreprendre des étudiants sur les campus et dans l’agglomération de Reims.

Notre école SUPINFO accueille ce vendredi 21 novembre 2014 à midi, deux entreprises qui partageront leur expérience :

  • USHOPIA
  • INFORMATION DIGITIZERS

Ce sera un moment convivial où vous êtes tous conviés. Alors venez nombreux !!

Continuer à lire Semaine de l’entrepreneuriat

Vous avez obtenu votre examen de fin d’année et vous souhaitez intégrer notre école supérieure d’informatique.

La campagne d’inscription de SUPINFO est toujours ouverte pour la rentrée 2014/2015.

Une inscription administrative est en ligne et accessible tout l’été sur : http://www.supinfo.com/Admission/ (dossier d’admission à compléter gratuitement).

Pour obtenir plus de renseignements, vous pouvez nous contacter afin de convenir d’un rendez-vous en nous écrivant à [email protected]

 

 

Continuer à lire Pas encore inscrit pour la rentrée 2014/2015 ?

Rencontrez SUPINFO Reims

Rencontrez-nous à l'occasion des Journées Portes-Ouvertes (JPO) organisées dans l'ensemble des campus SUPINFO en France et dans le monde.

Rencontrez SUPINFO Reims

Contactez SUPINFO Reims

Vous avez besoin d'informations complémentaires sur l'établissement ? Vous désirez parler à une conseillère d'orientation ou obtenir une adresse régionale ?

Contactez SUPINFO Reims
A propos de SUPINFO | Contacts & adresses | Conditions d'utilisation & Copyright | Respect de la vie privée
Logo de la société Cisco, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société IBM, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Sun-Oracle, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Apple, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Sybase, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Novell, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Intel, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Accenture, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société SAP, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Prometric, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Toeic, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo du IT Academy Program par Microsoft, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management

SUPINFO International University
Ecole d'Informatique - IT School
École Supérieure d'Informatique de Paris, leader en France
La Grande Ecole de l'informatique, du numérique et du management
Fondée en 1965, reconnue par l'État. Titre Bac+5 certifié au niveau I.
SUPINFO International University is globally operated by EDUCINVEST Belgium - Avenue Louise, 534 - 1050 Brussels