JeMeSouviens

Map of this page:

• Introduction and principle of flashcards
• Project Description
• The web interface
• Cards folder
• The software
• Download and install
• Set up on a website
• Tools used to develop JeMeSouviens

Introduction and principle of flashcards

The JeMeSouviens project is based on the flashcards system, adapted for use in class.

• FLASHCARD PRINCIPLE
  In 1972, the German psychologist Sebastian Leitner proposed a simple system for memorized learning:

  • we use a box with 5 compartments
  • in the first compartment, cards marked with a question are placed, the answer is on the back side
  • we draw a card, try to answer the question and watch the correction
    • if we knew the answer, the card passes through the next compartment of the box
    • otherwise, the card is returned to the first compartment
  • thereafter
    • the cards of the first compartment will be seen every day
    • those of the second every two days
    • those of the third one every 3 days
    • the fourth one every week.
    • the fifth one every month.

It’s the flashcard system. We also talk about spaced repetition.

See this page of Wikipedia again: spaced repetition.

• ADAPTATIONS
  • the Leitner system is designed for an individual with a relatively long apprenticeship period
  • it requires a large number of cards in the box, and a record of the status of the box each time
  • for classroom use, a rather small package of cards will be used for a theme to be revised
  • the goal is then to exhaust the deck of cards.

Project Description

• CARDS MAKING
  • constraints
    • cards must be easy to make
    • can be created with different tools
    • be able to take over existing documents
    • be carried out by the students (and validated by the teachers)
    • they must be usable locally
    • we need to be able to use them online
    • we need to be able to test them, share them, update them
  • choices made
    • each card will be made of 2 images (jpeg or png)
    • the name of the image displaying the question will end in -q (for example, my-card-q.jpeg)
    • the name of the image displaying the response will end in -r (for example, my-card-r.jpeg)
    • otherwise, the names and extensions of the 2 files must be identical
    • they can therefore be carried out in different ways
      • directly from GIMP (or other)
      • by hand and then scanned
      • using a graphic tablet
    • you can also generate them from a PDF file.
      The advantage is that any LibreOffice module can create a PDF file.
      See the software section.
• APPLICATION EXAMPLES
  • in class: the teacher validates, depending on the students’ (sometimes contradictory) answers
  • two: one manages the software, the other answers
  • alone: to review independently.
• CARDS CREATION
  • a lot of work
    • the system is only of interest if the number of cards is large
    • unworkable on its own
  • interest in delegating this part to students
    • faster cards creation
    • the student who makes questions revises the notion at stake
    • motivation
    • technical skills
  • teacher role
    • distribution and management of work
    • design assistance and validation
    • ensure the legality of the documents produced (licenses).

The web interface

It is available online here: https://clgdrouyn.fr/jemesouviens.

To use it locally, download and decompress the archive (see download and installation section).
Then open the jemesouviens/index.html file in your browser.

Its operation is simple:

• select a folder and click the Start button.
  You can also take random cards

• when a question is displayed:
  • a click on the screen will display the answer
  • you can also use the Show answer button on the toolbar

• once the response is displayed:
  • if the proposed answer was right, just click to the right of the screen
  • you can also use the The answer was correct button

• if not:
  • if the proposed answer was false, just click to the left of the screen
  • you can also use the The answer was false button

• OTHER CONTROLLERS
  • KEYBOARD
    • show answer: space
    • the answer was correct: V, →
    • the answer was false: X, ←
    • restart: esc
  • TOUCHSCREEN
    • same use as with a mouse
  • GAMEPAD
    • show answer: any button
    • the answer was correct: button 1
    • the answer was false: button 2

Cards folder

• all cards of the game are located in the folder CARDS (located on the site and in the archive if you download it)
• folder CARDS contains several subfolders
  • _tools: this folder contains various files essential for the program’s operation. It should therefore not be deleted.
  • folders and subfolders created by the site administrator (and which it can assign to certain users).
    For example, the archive already contains the subfolder demo
  • a folder MyCards (created at the first launch of the card management software).
    It is in this folder that you will have to place the cards you will make

The software

The software allows you to manage the cards and send them to a website.
It is developed in Python 3 and PyQt5. See the download and installation section to install it.
It is located in the jemesouviens/jmspython folder of the archive.

• TEST THE GAME (especially new cards created)

• CREATE CARDS FROM A PDF FILE
  • cards are always made of 2 images:
    • one to view the question; its name must necessarily end with -q (for example my-card-q.jpeg)
    • one to display the response; its name must necessarily end with -r (for example my-card-r.jpeg)
    • otherwise, the names and extensions of the 2 files must be identical
  • the action “PDF file” allows to create cards from a file *.pdf
    • every odd page will be transformed into question
    • each even page will be transformed in response
  • after selecting a PDF file
    • you can choose the format of images (jpeg or png)
    • you can select their width
    • you can request the creation of a subfolder to place the cards (otherwise they will be created next to the PDF file).

• CREATE CARDS USING THE SYNTAX MARKDOWN
  • page breaks are obtained by —- (4 signs -)

• a button allows you to create a PDF file from the opened Markdown file

• PRINT CARDS
  • this action is available through the “Tools” menu
  • after selecting a folder containing cards, a PDF file of the cards will be created
  • you can simply print it on both sides to obtain cutting cards.

• DOWNLOAD OR UPLOAD CARDS

• the goal is to be able to manage the cards of a site by http (or https).
  By default, this is the address of the instance of JeMeSouviens of the proposed Leo DROUYN College, but you can use another one
• even without a user account, you can download the cards of the site with the button located on the top right.
  This also makes it possible to update them

• if you have a user account on the site, you will be able to send your cards there
  • the subfolders of the site to which you have access are available in a drop-down list
  • each of these subfolders will correspond to a subfolder of the same name located in the local folder MyCards
  • it is in these local subfolders that you must create and organize your cards
  • you can also place the source files (PDF etc)
• 4 actions allow you to update your files.
  So that several users can manage the same subfolder, files present on the site but not in your local folder are treated separately
  • compare: allows you to list the status of files (existing only at the site or in local, more recent on site or local).
    No files are downloaded or sent by this action.
    It allows you to check the status of the different files before synchronizing
  • synchronize:
    • more recent files on the site are downloaded
    • more recent files locally are sent
    • files that only exist locally are sent
  • download files from the site: all files existing on the site but not in your local subfolder will be downloaded.
    To do if you are more than one user (to recover files from other users) or if you have changed computers and want to recover your files
  • delete files from the site: all files existing on the site but not in your local subfolder will be deleted from the site.
    To be done after the previous action if you are working on the selected subfolder together, in order not to delete files from other users.
    Allows you to delete files that you have deleted locally from the site

Download and install

• PLAY ONLINE
  if you just want to test the online game, click here: https://clgdrouyn.fr/jemesouviens

• DOWNLOAD
  to retrieve JeMeSouviens and use it on your computer, download and decompress the archive jemesouviens.tar.gz
  (under Windows, you can use the free software 7-Zip).
  Content of the archive:

  • index.html file: launch the game
  • jmsweb folder: contains the web interface
  • jmspython folder: contains the card management software. Its installation is detailed below
  • CARDS folder: see paragraph cards folder above
    
    

• INSTALL THE CARD MANAGEMENT SOFTWARE
  to function, the “software” part of JeMeSouviens needs to

  • Python 3: programming language
  • PyQt5: “toolkit” (graphical interface and a lot of things)
  • Pandoc : to convert Markdown files
  • pdftoppm of the Poppler project: to convert PDF files into images
  • Windows only, Python for Windows Extensions: allows you to create a shortcut on the desktop.

• SOURCES
  • development at GitLab.

Set up on a website

• SETTING UP
  • drop the folder jemesouviens on your site (with FTP)
  • it will be accessible through the address SITE_ADDRESS/jemesouviens
  • you can delete the subfolder jmspython which is useless on the site
  • use the software to change the administrator’s name and password (see below)
• USER MANAGEMENT
  • start by modifying the site address (check with the button Test configuration)

• request the menu Tools → User management, then log in.
  The initial login and password are admin (to be changed for more security)

• start by changing the login and password of the administrator account

• a first user already exists (login: user, password: password) and can manage the subfolder /demo/table_carres.
  You can change his account or even delete it

• a button allows you to add a new user.
  It will have to be attributed
  • a name (login)
  • a password (which he can change)
  • one or more subfolders.

Remarks:

• the path of a subfolder must start with the character /
• the following characters must not be used in names: \ / : * ? < > " |
• the same subfolder can be assigned to several users
• to assign multiple subfolders to a user, separate them with the | character.

Tools used to develop JeMeSouviens

• basic Tools
  • Python: programming language
  • Qt: “toolkit” comprehensive (graphical user interface and a lot of things)
  • PyQt: link between Python and Qt
• for the web interface
  • JavaScript: programming language
  • Bootstrap: framework CSS/JS
  • PHP: programming language
• other libraries used and other stuff
  • marked: to view Markdown files
  • PDF.js: to view PDF files
  • pdftoppm from Poppler project: to convert PDF files to images
  • TaffyDB : database for JavaScript
  • OpenDyslexic : font
• miscellaneous
  • GNU GPL 3: GNU General Public License
  • logo from Openclipart