Date | Document | Revisions | Feedback for Next Iteration |
---|
2019-08-23 | Prototype: https://xd.adobe.com/view/b98ef251-c459-4cbc-4cb4-4cffeae64801-cfbf/ ** This prototype is not complete yet and needs further edits. This link will be updated soon. | - Modified the global menu
- Modified the Command section menu and added Hide/Show for different features
- Added new commands: draw, make music, and follow me
- Modified the custom commands
| - What about having more advanced drawing features?
- Do we need to connect this to a robot or can this work as an stand alone program for drawing/making music/choreographing a dance/ etc. ?
- Include a Zoom option for drawing
- When drawing a path using the draw command, where is my start and end point?
- Consider default titles for blocks user is building in case they have difficulty entering their names.
- For making music try different approaches, get inspiration from Creatability
- For making music command, do we need to have time limitation?
|
2019-08-15 | Interactive prototype: https://xd.adobe.com/view/303a27da-8d7f-46a4-5647-bdc7c9e278bf-460b/ Prototype: https://xd.adobe.com/view/b98ef251-c459-4cbc-4cb4-4cffeae64801-cfbf/ ** Please note that these are interaction design wireframes and do not represent the visual design of the C2LC prototype. | Applied the feedback from the co-design sessions at the summer camps: - Added a global menu for the interface, thus, users can adjust their interface settings, such as language, appearance, view mode, etc.
- Added a menu for each panel thus users can customize their interface based in their specific needs
- Added a feature for building custom blocks (including repeat patterns)
| - When in Text mode: make sure there is a way for communicating errors, such as "You have a command that we don't know what to do with"
- Voice commands: talk to people who use voice commands and screen readers to better understand the logistics of integrating voice commands in this UI. for example, If you choose a command by voice, how do you pick the destination for it? how do you select or drag and drop by voice commands?
- Move the "Tracking speed" from the program menu to the global menu. This could be a more generic option for adjusting the speed of the interface and maybe called "speed", "interaction speed" etc.
- Think about the program menu when it's in the text mode. Do we need extra options? how should we modify the current options?
- When running the code, we can show the animation for each symbol
- Add an option for show/hide parameterizing option to the program menu
- Do we need an Undo/Redo feature?
- We need a capability to edit the custom blocks
- Consider using text editor to create custom blocks
- Add options to hide/show features of the programming language in the command panel menu
- Include capability for copying and pasting parts of code - Maybe a loop block that loops everything before it.
- Think about different models of creative expression. Don't be limited by this current model that is applied by most existing coding tools - imagine Mbot following my clapping to build a path, or following a laser pointer to build a sequence.
- Maybe include other categories in the command section, such as a category for drawing, making music, etc.
- Enable using different modes of interaction when building a custom block to include drawing, music making, body movements, etc.
|
2019-06-17 | | Suggestions to improve the C2LC prototype from the co-design sessions at summer camps >> | Commands Section- Blocks need colour, need to know the bottom of the arrow, need text and symbol on the command block (or ability to choose) Left & right arrows need to have curves to show the turn
- Adding additional movements, such as backward/down, diagonal, half turns, and 180 degree turns, jump, run, reverse/backwards, poke, spin, light up, flash red, talk, dance, draw, draw more shapes similar to circles, roll in water, go underwater, drive a car, have a schedule, fly, fight against other robots, put bad people in jail, do everything for the camper (i.e. give him a bath, bring him a drink, pull a trick for him, etc.), circle, loop de loop, and rainbow arc (i.e. half circle), make a sound, say hooray, make a burp sound (participants showed great interest in silly sounds or behaviors from the robots).
- Adding options for repeating patterns and creating loops, have the robot go to the beach.
- Clearly defining how far a robot moves in standard units (i.e. centimetres)
- Keeping one arrow and adding an ability to rotate it in different directions to save space
- There were contrasting ideas about organizing the commands, using categories similar to Blockly vs. open menus similar to Sphero Edu.
- Adding colors to different command blocks, such as yellow
- Adding sound cues for each command and particularly for add and delete commands
- Incorporate blue-colored theme (i.e. blue command buttons)
- Campers like the clear and simple direction of the current prototype
- Buttons to be set further apart (i.e. more gutter/white space) for ease of access to controls on a touch-screen device
- Unique colour for each arrow/command (up in green, left in yellow, red in right, circle in orange, loop de loop in blue, rainbow arc in rainbow and trash in black)
- Add a button to change the colours settings.
- Replace ‘+’ button to ‘ADD’ in green
- Replace trash can button to a black ‘X’
Program Section
- Having different options to build a sequence, such as drawing (similar to Sphero Edu), dragging and dropping, selection, and using controls similar to gaming controllers
- Ability to highlight a section of code to copy or delete
- Ability to change the interface color
- Ability to track which part of the code is running (use of lights)
- Including speech to text and text input
- Having pop-up menus for available commands once a step is selected
- Hiding the steps when in the drag and drop mode
- Liked seeing the text in the alternative program but would not code using that text
- One line of selected commands is easy to recognize and follow
- Alternative program (text version) was not useful to users with low literacy skills
- Wanted to build their program the way they did with the Code and Go Mouse (pressing arrow buttons in a sequence directly on the mouse’s back)
- Wanted to have the option to draw their sequence
- Be able to use touch to build their program on a iPad similar to the Blockly app
- Be able to use a physical board like Cubetto’s control panel
Viewing Area- Adding a grid in the background and defining the scale of that grid (a map grid similar to Cubetto’s map.)
- Relabelling the “Viewing Area” to “Program Area” and “Run” button to “Start”
- Adding “Stop” and “Clear All” buttons to the set of available buttons
- Campers found the triangle ‘boring’; replace with a stick figure with a smiley face or a firetruck - Ability to change the color of the triangle or change it to a character or avatar (“pick a character any character you want”) and provide a grid of avatars (e.g. stick figure with a smiley face and hat)-Be able to select their own avatar, which includes a silly monster as an option.
- Using an arrow instead of the triangle to better indicate the direction of the movement
- Define destinations on the Viewing Area, such as “North”, South”, “Wall” etc. to help building a sequence
- Be able to add landmark items to the viewing area, such as mountains and treasures
- Be able to add background images to the viewing area, such as a forest background
- Include a picture of the connected robot (i.e. Dash) below the viewing area.
- Ability to hide or remove viewing area: a few campers did not use this viewing area because they preferred to see the robots moving with colours.
- Ability to project the camera-view on large screen (following robot movements)
Alternative Access- Ability to change language and select commands by voice.
- Auditory previews as the mouse hovers over an item/area on the interface
- Ensuring interface compatibility with access technologies, such as screen readers, mouse, keyboard, and braille keyboards
- Including display adjustments options (i.e. zooming in/out).
- Joystick, joystick, touch screen and a keyboard
- Eye tracking / Eye gaze
- Drag and drop
- Voice commands
- Switch controls
- Kinesthetic movement of the head (to mirror the robot head).
|
2019-06-10 | | - Updated the visual design to a more wireframy look. We decided to take a step back to avoid a visual representation that looks very polished and final. This will enable our co-designers to more comfortably play with the prototype and change its different components.
- Tried a new layout and added a vertical panel on the left to include a different range of actions- Inspired by Scratch UI
- Added a section to create custom actions. This section can be used to build custom actions as well as repeated patterns.
- Added a mobile view
| - Think of different terminology for "Action" and "My Action"- Possibly: Subroutine, Function, Block, Procedure, Sequence
- Remove or rethink the connection arrows between the "Actions", "program" and "Program Display" panels.
- Maybe in the future we have a universal "View Selector" panel for switching between different views. That panel in the future can hold: Symbol representation, text editor, gesture recognitions, drawing, etc.
- The function buttons, such as Add, Remove, etc. should be contextual and updated based on the view you are in. For example, Add and Remove functions are not relevant in the Text Editor's view.
- Further discuss the difference between repeated patterns and custom actions with the development team.
|
2019-05-15 | | - Tried a different layout
- Revised the "add step" flow
- Updated the icons and actions symbols
- Changed the connector line between program steps
- Built a global option for showing and hiding different sections of the UI
- Adjusted the workflows based on the interactions in the current C2LC prototype
|
- This looks like a final design, try a less refined version to create enough room for manipulation by co-designers
- Include a mobile view as well as a desktop view
- The Drawing View is taking up so much real state. Try different composition of various panels.
- In the custom layout drop down menu, remove the second column of check boxes (Show/Hide) - Maybe try a enable/disable toggle
- Use fonts with single-storey lowercase g and closed a (possibly “open dyslexic font”)
- Be aware that in smaller drawing views the Turtle can go off screen with 3 forwards
- Ensure that the visual design works with ATs such as iPad scanning, which draws squares on the screen for targets (shape of buttons)
- Add function for repeated patterns
|
2019-05-10 | |
| - Workflows don't match the current C2LC prototype
- Check boxes for show/hide actions or add and delete steps are too small and can't be easily targeted with eye gaze
- Make the "Example:" drop down menu more generic and move "drawing a square" under that menu and add more examples there
- The connector line between the program steps is problematic. The loop can be confusing for some learners
- Add function for repeated patterns
|