LCF - LE Proposed Beta UI Student-related Screens.
-
Upload
griffin-grant -
Category
Documents
-
view
212 -
download
0
Transcript of LCF - LE Proposed Beta UI Student-related Screens.
![Page 1: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/1.jpg)
LCF - LE
Proposed Beta UI
Student-related Screens
![Page 2: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/2.jpg)
Simple Design
Minimal Elements
1. Header
2. Single Toolbar
3. Content Area
![Page 3: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/3.jpg)
1. Header
2. Toolbar
3. Content Area
![Page 4: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/4.jpg)
Header Essential Elements
1. Avatar (64 x 64 pixels)2. Student Name3. Program Name4. ILO Code / Description5. Teacher Name6. Way for teacher to access teacher options (see next slide)7. Student Interests Indicator (frame color around avatar indicates)
8. Note: Sylvan website header art is used for decorative element
![Page 5: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/5.jpg)
From the Student LE, a teacher needs:
1. a way to show Teacher Controls
2. a way to re-orient (turn) screen
3. an option to show answers sequentially
4. an option to show all answers
![Page 6: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/6.jpg)
Beep
An alert sounds when Teacher Options are selected
![Page 7: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/7.jpg)
Teacher Controls window shows when selected
![Page 8: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/8.jpg)
Toolbar Essential Elements
1. Draw Tool2. Line Tool3. Highlight Draw Tool4. Highlight Line Tool5. Erase Tool6. Erase All Tool7. Shapes Tool8. Stamps Tool9. Color Picker10. Line Width11. Resources button12. I’m Done button
![Page 9: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/9.jpg)
Selecting Shapes displays drop-down menu
![Page 10: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/10.jpg)
Selecting Stamps displays drop-down menu
![Page 11: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/11.jpg)
Selecting Colors displays
some sort of Color Picker
![Page 12: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/12.jpg)
Selecting Line Width displays drop-down menu
![Page 13: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/13.jpg)
Clicking Resource button displays
tabbed Resources window.
Note- button icon should match program
![Page 14: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/14.jpg)
Clicking I’m Done button displays… ?
Idle screen?
Beep
An alert sounds when I’m Done button is clicked
![Page 15: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/15.jpg)
My Learning
Clicking within avatar displays floating My Learning window.
Tabs include:• My Skills• My Learning Log• My Interests• My Tokens• My Character
![Page 16: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/16.jpg)
Current and previous session progress shows along with skills mastered (gold star).
![Page 17: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/17.jpg)
Current and previous session notes show. Notes can be entered or edited and saved.
![Page 18: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/18.jpg)
Student interests can be entered or edited and saved.
![Page 19: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/19.jpg)
A different colored frame around the avatar indicates to the teacher that the student has entered (and saved) interests.
![Page 20: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/20.jpg)
Current and previous session “tokens earned” totals show.
![Page 21: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/21.jpg)
A collection of selectable avatars.
![Page 22: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/22.jpg)
Some possible examples of idle screen content:
![Page 23: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/23.jpg)
An example of hidden pictures game.
![Page 24: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/24.jpg)
An example of maze game.
![Page 25: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/25.jpg)
An example of crossword puzzle game.
![Page 26: LCF - LE Proposed Beta UI Student-related Screens.](https://reader036.fdocuments.in/reader036/viewer/2022070415/5697c0131a28abf838cccadb/html5/thumbnails/26.jpg)
An example of crossword puzzle game.