Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Make your likes visible on Facebook?

Connect your Facebook account to Prezi and let your likes appear on your timeline.
You can change this under Settings & Account at any time.

No, thanks

Zomb'IstiA

No description
by

Florian Hardy

on 19 February 2015

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of Zomb'IstiA

Site web
Serveur
Base de données
Zomb'IstiA
Gestion de Projet
Plateau de jeu
Abdelmounaim BELGHALEM
Johan BRUN
Brendan GOUIN
Florian HARDY

Cycle de vie
Cycle de vie en cascade
Modèle prédictif
Plus sûr
Macro-planning
Bon respect du planning
"Améliorations" et "Version II" non prévues
Gestion des sources
Utilisation du logiciel Git
Hébergement sur la plateforme GitHub
Suivi des modifications
Gestion des tâches
Abdelmounaim
Site web v1 - v2
Tchats - Classements
Gestion session et pages (app.js)
Brendan
Base de données
Couche persistance
Site web v2
Modélisation 2D de l'IstiA
Introduction
Conclusion
Jeu multijoueur temps réel en ligne
Jeu de rôle multijoueur par navigateur web en temps réel et persistant
ORPG - “Online Role Playing Game”

Objectifs doubles
Pédagogiques
Produits

Contraintes
Temps : 5 mois de travail (5 heures par semaine)
Technologies : Node.js, HTML5, Canvas et MongoDB
Non financières
Technologies
Langages de développement
Plate-formes
logicielles
Libraires et Frameworks
Outils d’aide au développement
Version 1.0
Version 2.0
Conception
Technologies : HTML5 - CSS3 - BootStrap

Framework Express :
Utilisation du template EJS
Gestion des pages coté serveur
Version 1.0
Version 2.0
Travail réalisé
Architecture globale (3 tiers - 5 couches)
app.js
Coordination
Managers
Models
Persistance
2 tiers
ème
1 tiers
er
3 tiers
ème
3 tiers
ème
Conception
Interface permettant à l’utilisateur de jouer
Dimensions 16:9
Création d'une maquette pour chaque version

Première version : éléments regroupés selon leurs relations avec le personnage ou la case

Seconde version : éléments regroupés par type, tout en restant en accord avec le personnage ou la case
Développement
Balise HTML5 <canvas> </canvas>
Pas d'outils WYSIWYG
Coordonnées en x, y
Dimensions hauteur, largeur
-> Solution : lier les éléments entre eux

Elements EaselJs
Stage
Conteneurs
Textes
Images
Animations (avec temporisation)
Difficultés
rencontrées
Améliorations
possibles
5 étages supplémentaires
Fonctionnement de l’ascenseur, avec choix d’étage
Système de clés
Équipements supplémentaire (casque, gants, bottes…)
Capturer des zombies
Désactiver les tchats dans l'amphi E

Système de “news”
Forums, publications des joueurs sur le site
Plateau de jeu sous Google Chrome

Port d’écoute du serveur

Téléchargement des images de l’application

Jouabilité sur tablettes et mobiles

Problèmes sur le serveur
Non-bloquant (asynchrone)
et événementiel
Utilise la puissance de JavaScript
Base de données NoSQL
Mongoose + Node.js
Contenu du site
Présentation du site
JavaScript
Langage interprété par le navigateur
Affichage des interfaces utilisateur
Déclenche un événement à la réception d'un ordre
Transfert l'ordre à la couche
coordination
via les sockets
Affiche les informations reçues

Ne fait aucun traitement avant d’envoyer au serveur
(pas de vérifications) !
EaselJs
CreateJs
PreloadJs
Bootstrap
jQuery
Application fonctionnelle

Problèmes surmontés grâce à :
Gestion de projet
(respect du planning, définitions des tâches)
Architecture solide et découpée

Apprentissage technologique et humain
Aptana
Résultats du projet
Cahier des charges respecté
Jeu fonctionnel
Déployé et accessible

Bêta lancé depuis 3 jours :
15aine de joueurs
Plaît aux testeurs (beau et original)
Pas de plantage du serveur
Quelques bugs sans gravité
Sulime Text
MongoVUE
Git
Gère la communication serveur <-> base de données
Dispose de fonction de lecture / écriture sur la base de données
Fait office d'ORM

Architecture web classique
Découpage en 5 couches (4 sur le serveur)
Interface client <-> serveur
Classe unique
Reçoit les requêtes du site et du plateau de jeu
Transfert les demandes aux managers
Gestion du temps réel
Gestion des événements programmés
Vue
Base de données
2 sem.
1 sem.
11 sem.
2 sem.
2 sem.
3 sem.
Total : 21 sem.
Florian
Plateau de jeu v1 - v2
Modélisation 2D de l'IstiA
Johan
Configuration serveur (app.js)
Couche coordination
Couche managers
Couche models
Plateau de jeu v2
Spécialisation des membres :
Plus ergonomique
Plus esthétique
Responsive design envisagé
Que fait cette couche ?
Côté fonctionnel privilégié
Utilisation de HTML5 / CSS3
Gestion des objets
Base de données virtuelle
Singleton
Définit les règles de gestion du cahier des charges
Contrôle les données reçues
Envoi les ordres à la persistance
Démonstration
JavaScript <--> MongoDb
Modélise un objet physique ou virtuel
Utilisateur, Score...
Toute l'application tourne autour de leurs gestions
Sauvegarde permanente des données
Communication avec le serveur très rapide
Schémas initialisés au lancement du serveur
Facilité de prise en main
Fonctionnalités
Site web
Tchats
Classement
Page des scores
Zone administration
Point d'entrée de l'application
Rempli diverses fonctions :
Configure le serveur
Initialise les managers
Gère les attaques de nuit / sauvegardes globales

Jeu
Diriger un personnage
Explorer l'IstiA en 2D
Interactions avec
Objets
Cases
Zombies
Joueurs
Attaque de nuit
EI4 - AGI - 2013/2014
Coordination
Persistance
l'
Fin de la présentation,

Merci de votre attention !
Full transcript