Merging geraldine's suggestions
This commit is contained in:
parent
4b88c85f77
commit
27bbd59bbb
BIN
img/new/03.png
BIN
img/new/03.png
Binary file not shown.
Before Width: | Height: | Size: 588 KiB After Width: | Height: | Size: 360 KiB |
|
@ -31,11 +31,14 @@ mais je me dois aussi de remercier \\
|
||||||
\item Julien \textsc{Fayer}, qui nous a accompagné durant les derniers mois
|
\item Julien \textsc{Fayer}, qui nous a accompagné durant les derniers mois
|
||||||
de nos stages
|
de nos stages
|
||||||
\item Bastien \textsc{Durix},
|
\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
|
\item David \textsc{Courtinot}, qui m'a fourni un soutien psychologique
|
||||||
lorsque JavaScript était méchant avec moi
|
lorsque JavaScript était méchant avec moi
|
||||||
\end{itemize}
|
\end{itemize}
|
||||||
|
|
||||||
|
\paragraph{}
|
||||||
|
ainsi que tous ceux qui ont participé à l'étude utilisateur.
|
||||||
|
|
||||||
\newpage
|
\newpage
|
||||||
\part*{Conclusion}
|
\part*{Conclusion}
|
||||||
|
|
||||||
|
|
|
@ -3,11 +3,12 @@
|
||||||
\section{Début du stage}
|
\section{Début du stage}
|
||||||
\paragraph{}
|
\paragraph{}
|
||||||
Encadré par Vincent Charvillat et Géraldine Morin, ce stage a commencé par une
|
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
|
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
|
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
|
était clairement présente, mais l'interface pour y parvenir était encore à
|
||||||
avait en fait deux options : la vidéo, ou la 3D.
|
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{}
|
\paragraph{}
|
||||||
Le stage a donc commencé par une phase bibliographique afin d'étudier l'état de
|
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}
|
\end{itemize}
|
||||||
|
|
||||||
\paragraph{}
|
\paragraph{}
|
||||||
Au bout de quelques semaines, j'ai décidé de faire le choix de la 3D et j'ai
|
Au bout de quelques semaines, j'ai décidé de faire le choix de travailler pour
|
||||||
commencé à découvrir les multiples façons de faire des interfaces 3D via HTML
|
des contenus 3D et j'ai commencé à découvrir les multiples façons de faire des
|
||||||
|
interfaces 3D via HTML
|
||||||
et JavaScript.
|
et JavaScript.
|
||||||
|
|
||||||
\subsection{Communication}
|
\subsection{Communication}
|
||||||
|
@ -39,8 +41,9 @@ avait des nouveautés à faire ou faites dans le programme.
|
||||||
\paragraph{}
|
\paragraph{}
|
||||||
Des réunions étaient organisées lorsqu'elles étaient nécessaires, soit environ
|
Des réunions étaient organisées lorsqu'elles étaient nécessaires, soit environ
|
||||||
toutes les deux semaines. Ces réunions étaient souvent faites via
|
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
|
vidéo-conférence, en présence de Wei Tsang Ooi, collaborateur de NUS (National
|
||||||
compte-rendus par mail.
|
University of Singapore), et je m'occupais de faire les compte-rendus des
|
||||||
|
réunions par mail.
|
||||||
|
|
||||||
\subsection{Tests}
|
\subsection{Tests}
|
||||||
Le site a été déployé à l'adresse \url{http://3dinterface.no-ip.org/}. Les
|
Le site a été déployé à l'adresse \url{http://3dinterface.no-ip.org/}. Les
|
||||||
|
|
|
@ -198,7 +198,7 @@ petit rectangle au voisinage du curseur.
|
||||||
~
|
~
|
||||||
\begin{subfigure}[b]{0.45\textwidth}
|
\begin{subfigure}[b]{0.45\textwidth}
|
||||||
\centering
|
\centering
|
||||||
\includegraphics[scale=0.16]{new/03.png}
|
\includegraphics[scale=0.18]{new/03.png}
|
||||||
\caption{Une prévisualisation dans notre système}
|
\caption{Une prévisualisation dans notre système}
|
||||||
\end{subfigure}
|
\end{subfigure}
|
||||||
\end{figure}
|
\end{figure}
|
||||||
|
|
|
@ -23,15 +23,22 @@ partie pour aller vers une zone recommandée.
|
||||||
\begin{subfigure}[b]{0.4\linewidth}
|
\begin{subfigure}[b]{0.4\linewidth}
|
||||||
\centering
|
\centering
|
||||||
\includegraphics[scale=0.2]{new/interface1.png}
|
\includegraphics[scale=0.2]{new/interface1.png}
|
||||||
|
\caption{Sans recommandations}
|
||||||
\end{subfigure}
|
\end{subfigure}
|
||||||
~
|
~
|
||||||
\begin{subfigure}[b]{0.4\linewidth}
|
\begin{subfigure}[b]{0.4\linewidth}
|
||||||
\centering
|
\centering
|
||||||
\includegraphics[scale=0.34]{new/interface2.png}
|
\includegraphics[scale=0.34]{new/interface2.png}
|
||||||
|
\caption{Avec recommandations\label{lecteur-reco}}
|
||||||
\end{subfigure}
|
\end{subfigure}
|
||||||
\caption{Des interfaces sans et avec recommandations}
|
\caption{Des lecteurs vidéo avec et sans recommandations}
|
||||||
\end{figure}
|
\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}
|
\section{Objectifs}
|
||||||
\paragraph{}
|
\paragraph{}
|
||||||
Ce projet a pour but d'appliquer les idées citées précédemment dans le contexte
|
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
|
Dans ce travail, on ne s'attachera pas à calculer des recommandations : elles
|
||||||
seront supposées connues. Dans la pratique, elle seront définies manuellement.
|
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}
|
\section{Présentation}
|
||||||
Nous allons dans un premier temps parler des technologies que nous avons
|
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
|
testées et utilisées. Nous verrons ensuite l'architeture du programme, qui peut
|
||||||
|
|
|
@ -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
|
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
|
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
|
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 :
|
sont disponibles, et donc, il n'y a pas de limite imposée par un
|
||||||
tout devient possible, mais il faut le faire soi-même.
|
\emph{framework} : tout devient possible, mais il faut le faire soi-même.
|
||||||
|
|
||||||
\subsection{C++ vers JavaScript}
|
\subsection{C++ vers JavaScript}
|
||||||
Le code compilé de C++ et transformé en JavaScript avec Emscripten à ses
|
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
|
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
|
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
|
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{}
|
\paragraph{}
|
||||||
Plusieurs langages et framework ont été testée :
|
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
|
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
|
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
|
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
|
à un script développé spécialement pour cela, qui s'utilise de la même façon
|
||||||
Closure Compiler qui sera utilisé pour la fusion au moment du le déploiement
|
que Closure Compiler, qui sera utilisé pour la fusion au moment du le
|
||||||
(ce dernier permet non seulement la fusion des fichiers mais aussi la
|
déploiement (ce dernier permet non seulement la fusion des fichiers mais aussi
|
||||||
minification\footnote{la minification sert notamment à réduire la taille du
|
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
|
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
|
intéressant de réduire la taille des programmes de sorte à les charger plus
|
||||||
rapidement} (effacement des commentaires et des retours à la ligne,
|
rapidement} (effacement des commentaires et des retours à la ligne,
|
||||||
|
|
|
@ -172,7 +172,7 @@
|
||||||
\centering
|
\centering
|
||||||
\includegraphics[scale=0.3]{new/interface2.png}
|
\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}
|
\caption{Des prévisualisations sur différentes interfaces}
|
||||||
\end{figure}
|
\end{figure}
|
||||||
\end{frame}
|
\end{frame}
|
||||||
|
|
Loading…
Reference in New Issue