\documentclass{beamer}

\usepackage[latin1]{inputenc}
\usepackage[french]{babel}
\usepackage{url}
% Ceux qui sont sympas:
% Boadilla
%\usepackage{beamerthemeWarsaw}
\usepackage{beamerthemeBoadilla}
\usepackage{moreverb}
\usepackage{picins}

%\usecolortheme{crane}

\newtheorem{myDefinition}[theorem]{Definition}

\title{Squeak, un amplificateur d'idées}
\author{Hilaire Fernandes}
\institute{OFSET}
\date{Automne 2006}

\logo{\includegraphics[width=.5cm,keepaspectratio=true]{balloon}}

\begin{document}

\begin{frame}
  \titlepage
\end{frame}

\section*{Contenu}
\frame{\tableofcontents}

\section{Introduction}

\begin{frame}
  \frametitle{Squeak, c'est quoi~?}  

  \begin{myDefinition}
  C'est \textbf{Smalltalk}, un environnement et un langage de pure
  programmation objet.
    
  \end{myDefinition}

      \begin{center} \includegraphics[width=6cm]{Squeak-devel}\end{center}
\end{frame}


\begin{frame}
  \frametitle{Squeak, c'est quoi~?}
  \begin{myDefinition}
  C'est \textbf{EToys}, un environnement interactif et multimédia de
  \textit{jouets électroniques} à créer et programmer graphiquement.
\end{myDefinition}
  \begin{center}
    \includegraphics[width=6cm]{Squeak-edu}
  \end{center}
\end{frame}


\begin{frame}
  \frametitle{Comment fonctionne-t-il~?}
  Comme tout environnement Smalltalk, Squeak est constitué de deux parties~:
  \begin{enumerate}
  \item Une machine virtuelle -- \textbf{VM} -- qui est un programme binaire
  \item Une \textbf{image} exécutée par la VM.
  \end{enumerate}
\end{frame}


\begin{frame}
  \frametitle{Où trouver Squeak~?}
  \begin{itemize}
     \item En français~: \url{http://community.ofset.org/wiki/Squeak}~;
     \item En anglais~: \url{http://www.squeak.org/} et \url{http://www.squeakland.org/} pour la partie éducative anglophone.
   \end{itemize}
\end{frame}

\section{Genèse de Squeak}

\begin{frame}
  \frametitle{Une ambivalence éducation-programmation}
  Pour explorer :
  \pause
  \begin{itemize}
  \item de nouvelles interfaces graphiques
    \begin{itemize}
    \item le pattern MVC vient du monde Smalltalk
    \item les interfaces Morphic
    \end{itemize}
    \pause
  \item de nouveaux modèles de programmation
    \begin{itemize}
    \item programmation incrémentale
    \item écriture de code et débuggage fusionnés
    \item méta-programmation
    \end{itemize}
    \pause
  \item de nouveaux environnement éducatifs
    \begin{itemize}
    \item expérimentation d'idées avec un modèle informatique
    \item approche constructiviste de l'apprentissage
    \end{itemize}
  \end{itemize}

\pause
\Large $\Rightarrow$ être un \framebox{\emph{amplificateur d'idées}}
\end{frame}

\begin{frame}
  \frametitle{Qui est derrière Squeak ?}
  \begin{columns}[t]
    \column[T]{9cm} \textbf{Alan Kay} est le principal architecte du
    langage Smalltalk et Squeak. Smalltalk fût inventé dans les années
    70.  Squeak dans les années 90 alors chez Apple, Disney, HP et
    maintenant par une communauté active.  \column[T]{2cm}
    \includegraphics[width=2cm]{alan}
  \end{columns}
\end{frame}

\begin{frame}
  \frametitle{Smalltalk, l'ancêtre de Squeak}
    \begin{columns}[t]
    \column[T]{8cm}
 \textbf{Smalltalk} est un langage conçu dans les '70~:
 \begin{itemize}
   \item un \textit{meta}-langage objet pur, simple et uniforme
   \item un navigateur de classe pour accéder à TOUT
   \item un environnement de développement
 \item un langage \textbf{et} un environnement utilisable par des enfants
 \end{itemize}

    \column[T]{2cm}
    \includegraphics[width=3cm]{alto}

    \includegraphics[width=3cm]{alto2}
    \tiny L'Alto
  \end{columns}
\end{frame}

\section{Squeak, environnement éducatif}

\begin{frame}
  \frametitle{Etoys}
  \begin{myDefinition}
    \textbf{Etoys} est un \textit{framework} de programmation
    graphique pour enfants et adultes !\\
    L'utilisateur conçoit des objets et programme leurs comportements
    avec des briques graphiques enfichables.
  \end{myDefinition}
  \pause
  \begin{example}
    Donner du sens à la notion de nombre positif/négatif avec une voiture programmée pour avancer/reculer ou tourner à droite/gauche.
  \end{example}
  \pause

  $\Rightarrow$ aspect constructiviste

  $\Rightarrow$ modéliser des situations
\end{frame}

\begin{frame}
  \frametitle{Etoys and co.}  
  Par dessus Etoys, il existe une
  collections d'outils éducatifs
  \begin{block}{ODECo}
    Système dynamique pour simuler des systèmes d'objets soumis à la
    gravité
  \end{block}
  \begin{center}
    \includegraphics[width=6cm]{odeco}
  \end{center}
\end{frame}

\begin{frame}
   \frametitle{Etoys and co.}  
   \begin{block}{Kedama}
     Système de simulation de particules
   \end{block}
  \begin{center}
    \includegraphics[width=7cm]{kedama}
  \end{center}
\end{frame}


\begin{frame}
   \frametitle{Etoys and co.}  
   \begin{block}{Vtoys}
     La programmation visuelle sans texte
   \end{block}
  \begin{center}
    \includegraphics[width=7cm]{vtoys}
  \end{center}
\end{frame}

\begin{frame}
   \frametitle{Etoys and co.}  
   \begin{block}{Bots Inc}
     Environnement d'apprentissage à la programmation
   \end{block}
  \begin{center}
    \includegraphics[width=7cm]{botsinc}
  \end{center}
\end{frame}

\begin{frame}
   \frametitle{Etoys and co.}  
   \begin{block}{Dr. Geo II}
     Framework de géométrie interactive
   \end{block}
  \begin{center}
    \includegraphics[width=7cm]{drgeo2}
  \end{center}
\end{frame}

\section{Squeak, environnement de développement}
\subsection{Le langage}

\begin{frame}
  \frametitle{Un langage pour se concentrer sur l'essentiel }
  \begin{itemize}
  \item tout est objet
  \item $\Rightarrow$ un seul type de variable, pour référencer des
    objets
  \item un modèle consistent: toute chose dans Smalltalk est vraiment un 
    objet~!
  \item des \textit{itérateurs} de haut niveau, de toute façon on peut
    les compléter
  \item des objets, des messages et des blocs de code, c'est tout~!
  \item tous les opérateurs peuvent être étendus
  \item pas d'attribut public, protected, private, etc $\rightarrow$ tous sont protected
    \item et bien sûr un ramasse miette -- \textit{garbage collecor}
  \end{itemize}
\end{frame}

\begin{frame}[fragile]
  \frametitle{Coercition des objets}
  Le typage en Smalltalk est défini par les objets eux-mêmes (typage de second ordre). Il est alors aisé d'avoir des objets qui semblent muter~:
\begin{verbatim}
a := 1/3.
a class. -> Fraction
a := a + (2/3).
a class. -> SmallInteger
\end{verbatim}
\end{frame}

\begin{frame}[fragile]
  \frametitle{Des itérateurs de haut niveau} 
Les itérateurs s'utilisent avec des blocs de code~:
\begin{itemize}
\item sélectionner des nombres d'une collection
\begin{verbatim}
#(1 2 3 4 5) select: [:i | i odd] -> #(1 3 5)
\end{verbatim}
\item calculer des valeurs sur une collection :
\begin{verbatim}
#(1 2 3 4 5) collect: [:i | i * i ] -> #(1 4 9 16 25)
\end{verbatim}
\end{itemize}
\end{frame}


\begin{frame}[fragile]
  \frametitle{Les blocs de code}
   Comme promis ce sont des objets !
  \begin{itemize}
  \item C'est une fonction anonyme ($\approx  \lambda$-fonction en Scheme).
  \item Il peut être passé à une méthode comme argument
  \item Comme tout objet il peut être référencé par une variable et utilisé comme une fonction mathématique~:
\begin{verbatim}
f := [:x| (x raisedTo: 3)]
f value: 5 
  -> 125
(1 to: 10) collect: [:x | f value: x] 
  -> #(1 8 27 64 125 216 343 512 729 1000)
\end{verbatim}
    \item \alert{Vous les utiliserez beaucoup} et \alert{vous aimerez ça~!}
\end{itemize}
\end{frame}

\subsection{Les outils de développement}
\begin{frame}
  \frametitle{Le navigateur de code} 
  
  La navigateur de code -- ou \textit{browser} -- est l'outil central
  du développeur Smalltalk. Il permet d'écrire et de naviguer dans les
  classes et méthodes.
  \begin{center}
  \includegraphics[width=8cm,keepaspectratio=true]{squeak1}    
  \end{center}
\end{frame}


\begin{frame}
  \frametitle{Le trouveur de méthode}

  Smalltalk est un langage réflexif capable d'introspection~: il peut
  déterminer une méthode répondant à un comportement donné.  Ici avec
  le motif \textbf{'abcd' . 'bc' . 'ad'} nous trouvons les méthodes
  enlevant une sous chaîne d'une chaîne de caractères~:

  \begin{center}
    \includegraphics[width=7cm,keepaspectratio=true]{squeak3}        
  \end{center}
\end{frame}

\begin{frame}
  \frametitle{L'inspecteur} 
  Avec l'inspecteur, alors que vous programme fonctionne, vous pouvez de façon \textit{très confortable}~:
\begin{enumerate}
\item inspecter vos classes et leurs attributs
\item modifier les attributs alors que le programme fonctionne
\end{enumerate}
  \begin{center}
    \includegraphics[width=9cm,keepaspectratio=true]{squeak4}        
  \end{center}
\end{frame}

\begin{frame}
  \frametitle{Le debugger} Avec le débuggueur vous pouvez débogguer,
  c'est la moindre des choses~!  \pause Mais vous pouvez aussi
  corriger les bugs et recompiler la méthode \textit{en situation}
  \pause

  $\Rightarrow$ c'est une des facettes du développement incrémentale
  qui divise par \textbf{deux} votre temps de développement.
  \begin{center}
    \includegraphics[width=9cm,keepaspectratio=true]{squeak5}        
  \end{center}
\end{frame}

\section{Conclusion}
\begin{frame}
  \frametitle{En quelques mots...}
  \begin{center}
    \includegraphics[width=2cm]{balloon}
  \end{center}
  Le symbole de Smalltalk est la montgolfière, ballon à air chaud qui
  s'élève dans les airs. C'est effectivement le sentiment que donne
  cet environnement, alors n'hésitez pas à l'utiliser, car en plus
  c'est libre~!

  Une communauté sympathique vous attend sûr~:
  \begin{center}
    \alert{\url{http://community.ofset.org/wiki/Squeak}}
  \end{center}
\end{frame}


\end{document}