This module has several different parts to it that we wanted to define within our idea and to make sure that we are hitting each of them, at least in thought process if not physical code.
Since our idea is about typos, the feedback is indicating that the typos are actually there. The difference, however, between spell checking programs that currently exists and what we are trying to do is that indicating the typos should not be intrusive to stop creative flow, but should be apparent when necessary. That being said, now we have this idea of controlling intrusiveness and has to be shown through variable text. Our ideas so far:
if the text is “regular” (no stylizing, especially no bold/italics), the wrong can have a heavier weight
if the text is bolded, then the typo can be lighter
it can be animated from less bold to more bold and loop to give a “breathing” effect
can we express this through “heaviness” as a property?
heaviness can be felt through increase font weight, making the letters wider and feel like they’re taking a toll on the page and this being animated could be a good way to indicate a typo when you’re revisiting and editing
increasing boldness, terminals and width
generally manipulating the typo to make it stand out from the text
After showing that the text is wrong with the feedback, the next step is somehow indicating that now it needs to be fixed and perhaps how it can be fixed. Jens said that something like how when you right click on a spelling mistake and there are suggestions on how to fix it may be possible through variable text. Looking at this, we thought of:
manipulating the specific letters in the typo to indicate the specific mistake
taking it further, we can put an animation on those letters to show how the word may be corrected
eg: Chruch --> Chruch --> Church (where the ‘r’ and the ‘u’ which are in the wrong places could switch places through looped animation to show how to correct)
Although this is good, the feedforward itself isn’t shown through variable type
after showing the feedback and bringing attention to the typo, the hover function can be used to activate that animation or can be used with the other variable type axes together to make the wrong letters stand out from the word
eg Chruch --> Chruch --> Chruch
Now we have got an idea to indicate that the typo exists with feedback and how to fix it with feedforward, but what about degrees of wrongness and showing other nuances so that it’s not just showing that there either is a typo or there isn’t? First we have to look at what the potential nuances are:
Spelling errors, grammatical errors, technical errors
degree of wrongness (for example if there’s one letter extra/or a letter is switched with another vs if there are many extra letters and the word is undecipherable) then the word/letters could be more bolded, sharper, etc
how it could be integrated with page position or scrolling position
what happens if the typo gets more apparent the farther it is from where you are typing? What if it get’s more apparent when you scroll closer to it?
We can’t explore all of these nuances with the time constraint and coding limitations but we can explore them in thought process and see where and why they can be used.
- “the product’s reaction and the users’ action coincide in time” We went against this. For it to be non-intrusive, the feedback had to come later. (on the animation, not the hovering)
- even if the feedback comes directly, you still might not notice it because it doesn’t necessarily pop out
- Location of feedback changes changes, but only because of the fact that as people are typing the past stuff moves up or down if we scroll
-played with time a lot, everything can be expressed through how long/short the animation plays for (urgency)
-but we never looked at the differences between how much time has passed for the the animation to show up (that’s something we should’ve explored more!)
- if we used the rotating letters animations, “the direction of movement of the product’s reaction is coupled to the direction or the movement of the users’ action” play around with this
