Embed Size (px)
Citation preview
CloudCardThe Interactive Learning Tool for the Connected Classroom
By Marc Bacvanski
Goal: Make learning more engaging outside of the classroom
The solution
Teacher-created flashcards that integrate with Google Spreadsheets
Android-based app for student studying
Web application for teachers to see data on student studying
Flow of Interactions
Teacher
Student
Create DeckGoogle Spreadsheets
Register DeckMy web app: cloudcard.us
Access CodeEnters access code for deck
Access CodeGives access code to students
StudyingStudent studies the deck materials
StatisticsStatistics on student studying
System Diagram
Teacher Student
Web app in the cloud
Google Sheets
Features: Teacher
Easy Organization
Teachers can easily organize their decks of
cards
Statistics Platform Deck Management
Powerful platform for data analysis: gives feedback for teachers' student's
behavior
Intuitive interface to easily manage decks
100% Cloud Based
Completely cloud based, allowing teachers to
access the system from anywhere on the world
● Refined UI highlights important aspects
● Simple to use, powerful features underneath the hood
Easy Organization
Student Statistics
● See when students are studying● How many students have
studied?● Lets teachers better refine their
techniques
Flashcard Management: Google Sheets
● Integration with Google Spreadsheets
● Easy import and export of cards● Security: Random access code
generation● Future: Interactive, multimedia
content in cards
● Readily scalable● High reliability● Low cost: no installation necessary● Ready for global usage● Connect from anywhere in the world
Cloud Based
Features: Android App
Intuitive UI
Easy to learn, powerful to use to enhance learning outside of the classroom
Material Design Saved Decks
Google's Material Design for clean and simple
interactions
Decks are downloaded and cached for offline use
Bug Reporting
Advanced bug reporting using Instabug
Intuitive UI & Material Design
Saved Decks: Offline Studying
● Students can study on the go● Decks are automatically saved
after first download● Fast, easy way to learn without
an internet connection
● Integration with Instabug● User shakes device to send
feedback● Bug reports show stack
trace and other user data to help diagnose the problem
Bug Reporting: Instabug
Technologies Used
Open sourced on GitHub:
github.com/Flashcard-App/
MVC Architecture
This app uses a Model-View-Controller architecture.
● Model: How the data is represented
● View: How the user interacts with the app
● Controller: Changes the model
Fragment Transactions
Fragment Inheritance
Fragments inherit from a common IntermediateFragment, allowing several things:
● Backwards and forward navigation● Shared implementation of common
methods● Standardized methods for
navigation
IntermediateFragment
● previous : IntermediateFragment
● next : IntermediateFragment
● @Override...
CardQuizFragment EnterCode
Classes and Resource Organization
● 2,824 lines of code● Java, JavaScript, EJS, CSS,
XML● Vector graphic design
● Custom JSON Serialization● Google Spreadsheet integration
REST Web Application
● Google OAuth2● Asynchronous, scalable
Node.js● MongoDB database
● Running in Google Compute Engine
● Separate servers for database, back-end data collection, and web app for teachers
