diff --git a/img/new/03.png b/img/new/03.png index cba0d79..cc8b0fc 100644 Binary files a/img/new/03.png and b/img/new/03.png differ diff --git a/rapport/conclusion.tex b/rapport/conclusion.tex index 2aee22a..5125521 100644 --- a/rapport/conclusion.tex +++ b/rapport/conclusion.tex @@ -31,11 +31,14 @@ mais je me dois aussi de remercier \\ \item Julien \textsc{Fayer}, qui nous a accompagné durant les derniers mois de nos stages \item Bastien \textsc{Durix}, - \item Vincent \textsc{Angladon}, + \item Vincent \textsc{Angladon}, pour ses visites régulières \item David \textsc{Courtinot}, qui m'a fourni un soutien psychologique lorsque JavaScript était méchant avec moi \end{itemize} +\paragraph{} +ainsi que tous ceux qui ont participé à l'étude utilisateur. + \newpage \part*{Conclusion} diff --git a/rapport/gestion.tex b/rapport/gestion.tex index 0bdd542..ec2a69e 100644 --- a/rapport/gestion.tex +++ b/rapport/gestion.tex @@ -3,11 +3,12 @@ \section{Début du stage} \paragraph{} Encadré par Vincent Charvillat et Géraldine Morin, ce stage a commencé par une -phase de découverte du sujet, qui n'était alors pas clairement fixé : l'idée +phase de découverte du sujet, qui n'était alors pas clairement fixée : l'idée d'utiliser des recommandations pour influencer l'utilisateur afin d'être capable de prévoir ses interactions et de s'en servir pour réduire la latence -était clairement présente, mais l'interface n'était pas encore fixée. Il y -avait en fait deux options : la vidéo, ou la 3D. +était clairement présente, mais l'interface pour y parvenir était encore à +définir et à développer. Il y avait en fait deux options pour le contexte de ce +travail : la vidéo, ou la 3D. \paragraph{} Le stage a donc commencé par une phase bibliographique afin d'étudier l'état de @@ -26,8 +27,9 @@ pu leur apporter une petite aide : \end{itemize} \paragraph{} -Au bout de quelques semaines, j'ai décidé de faire le choix de la 3D et j'ai -commencé à découvrir les multiples façons de faire des interfaces 3D via HTML +Au bout de quelques semaines, j'ai décidé de faire le choix de travailler pour +des contenus 3D et j'ai commencé à découvrir les multiples façons de faire des +interfaces 3D via HTML et JavaScript. \subsection{Communication} @@ -39,8 +41,9 @@ avait des nouveautés à faire ou faites dans le programme. \paragraph{} Des réunions étaient organisées lorsqu'elles étaient nécessaires, soit environ toutes les deux semaines. Ces réunions étaient souvent faites via -vidéo-conférence, en présence de Wei Tsang, et je m'occupais de faire les -compte-rendus par mail. +vidéo-conférence, en présence de Wei Tsang Ooi, collaborateur de NUS (National +University of Singapore), et je m'occupais de faire les compte-rendus des +réunions par mail. \subsection{Tests} Le site a été déployé à l'adresse \url{http://3dinterface.no-ip.org/}. Les diff --git a/rapport/interface.tex b/rapport/interface.tex index b872d15..4f16a41 100644 --- a/rapport/interface.tex +++ b/rapport/interface.tex @@ -198,7 +198,7 @@ petit rectangle au voisinage du curseur. ~ \begin{subfigure}[b]{0.45\textwidth} \centering - \includegraphics[scale=0.16]{new/03.png} + \includegraphics[scale=0.18]{new/03.png} \caption{Une prévisualisation dans notre système} \end{subfigure} \end{figure} diff --git a/rapport/presentation.tex b/rapport/presentation.tex index ac8f0ed..0b1671e 100644 --- a/rapport/presentation.tex +++ b/rapport/presentation.tex @@ -23,15 +23,22 @@ partie pour aller vers une zone recommandée. \begin{subfigure}[b]{0.4\linewidth} \centering \includegraphics[scale=0.2]{new/interface1.png} + \caption{Sans recommandations} \end{subfigure} ~ \begin{subfigure}[b]{0.4\linewidth} \centering \includegraphics[scale=0.34]{new/interface2.png} + \caption{Avec recommandations\label{lecteur-reco}} \end{subfigure} - \caption{Des interfaces sans et avec recommandations} + \caption{Des lecteurs vidéo avec et sans recommandations} \end{figure} +\paragraph{} +Dans la figure \ref{lecteur-reco}, les points blancs représentent des débuts de +passages intéressants. Les zones gris clair représentent les passages chargés, +et les zones gris foncé les passages qu'il reste à charger. + \section{Objectifs} \paragraph{} Ce projet a pour but d'appliquer les idées citées précédemment dans le contexte @@ -55,6 +62,19 @@ retrouve dans une zone de la scène qui n'est pas encore chargée. Dans ce travail, on ne s'attachera pas à calculer des recommandations : elles seront supposées connues. Dans la pratique, elle seront définies manuellement. +\section{Description globale du projet} +Pendant ce projet, nous avons développé une interface qui permet de naviguer +dans une scène en 3D. Cette interface sera complétée d'une tâche à réaliser +(collecter des pièces rouges). Pour aider l'utilisateur à naviguer dans la +scène, des mécanismes de recommandations seront introduits, et nous allons +chercher à savoir à quel point ces mécanismes aident les utilisateurs. + +\paragraph{} +Nous présenterons ensuite un mécanisme de chargement intelligent de la scène +3D. Nous ne parlerons pas de pré-chargement puisque ce projet n'est pas arrivé +jusqu'au point où nous serions capable de prédire le comportement de +l'utilisateur. + \section{Présentation} Nous allons dans un premier temps parler des technologies que nous avons testées et utilisées. Nous verrons ensuite l'architeture du programme, qui peut diff --git a/rapport/techno.tex b/rapport/techno.tex index a351f09..e6925ee 100644 --- a/rapport/techno.tex +++ b/rapport/techno.tex @@ -23,8 +23,8 @@ utilisation plus simple ne sont pas disponibles dans OpenGL ES pour des raisons de performance. L'utilisation de WebGL devient donc assez complexe, et le simple dessin d'un cube tournant avec une lumière et une caméra devient très complexe. La contrepartie de WebGL est que toutes les fonctions élémentaires -sont disponibles, et donc, il n'y a pas de limite imposée par un framework : -tout devient possible, mais il faut le faire soi-même. +sont disponibles, et donc, il n'y a pas de limite imposée par un +\emph{framework} : tout devient possible, mais il faut le faire soi-même. \subsection{C++ vers JavaScript} Le code compilé de C++ et transformé en JavaScript avec Emscripten à ses @@ -81,7 +81,7 @@ problématiques de dynamicité\footnote{On oppose les sites dynamiques (par exemple les réseaux sociaux) aux sites statiques (par exemple les blogs) : dans un site statique, l'utilisateur ne peut pas interagir avec le site. Le site se contente de délivrer une information.} sont arrivées, il a fallu choisir une -technologie pour le côté serveur, et là, tous les langages étaient possibles. +technologie pour le côté serveur, et là, de nombreux langages étaient utilisables. \paragraph{} Plusieurs langages et framework ont été testée : @@ -125,10 +125,10 @@ d'espace de stockage, nous avons préféré l'héberger nous-même. Pour éviter d'avoir des fichiers trop longs, nous avons choisi de séparer les sources dans de nombreux fichiers de taille plus petite, et de les fusionner automatiquement. Pour le développement, ils seront simplement concaténés grâce -à un script développé spécialement pour cela, qui mime les paramètres de -Closure Compiler qui sera utilisé pour la fusion au moment du le déploiement -(ce dernier permet non seulement la fusion des fichiers mais aussi la -minification\footnote{la minification sert notamment à réduire la taille du +à un script développé spécialement pour cela, qui s'utilise de la même façon +que Closure Compiler, qui sera utilisé pour la fusion au moment du le +déploiement (ce dernier permet non seulement la fusion des fichiers mais aussi +la minification\footnote{la minification sert notamment à réduire la taille du script : n'oublions pas que nous parlons de serveur web, et il est donc intéressant de réduire la taille des programmes de sorte à les charger plus rapidement} (effacement des commentaires et des retours à la ligne, diff --git a/slides/main.tex b/slides/main.tex index f427416..1e0c83b 100644 --- a/slides/main.tex +++ b/slides/main.tex @@ -172,7 +172,7 @@ \centering \includegraphics[scale=0.3]{new/interface2.png} ~ - \includegraphics[scale=0.13]{new/03.png} + \includegraphics[scale=0.15]{new/03.png} \caption{Des prévisualisations sur différentes interfaces} \end{figure} \end{frame}