* Haptic Design System ** Basic Philosphy Simple, Clean, Haptic You just wanna touch it ! Borrow design metaphors from real life appliances, before the age of touchscreens. (Ironic isn't it ?) ** Ideas *** 3d components *** specific purpose: **** chat? - receipt printer ????????????????????????? - how to keep minimal - endless paper ? textured ? - which animations are needed ? - grow "paper" from bottom line-by-line - how to animate editing past msgs ? **** casette deck front, with disk in/out ***** ASCII: ``` o=blinkenlights O=eject? ___________________________________________________________________ | --------------------------------------- ooo O | |_________________________________________________________________| ``` ***** Blinkenlights - 1 light per model? - red=error - blue=ready - green=loaded - blinking=busy *** "Controls" (Write/Input) **** TextInput ????? - full paper seems to noisy visual wise ??? - try "light" paper texture ? (if that exists?) - segment display might have bad ux/accesibility, expecially for textareas, could be ok for small/short textinput **** Button Variants ***** Kippschalter ref: https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fasset.conrad.com%2Fmedia10%2Fisa%2F160267%2Fc3%2F-%2Fde%2Fae5b0377843744940beabc4c1cd5fd514%3Fx%3D360&f=1&nofb=1&ipt=3cce10e16c763da58c31abb0b2c4888906fa9e312cf746696fa3b6573bcd1e16&ipo=images ***** Drehschalter ref: https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fwww.elektrogrosshandel.ch%2Fthumbor%2FOauclzeS99hWVZgbRjx6of7sEwY%3D%2Ffit-in%2F3600x2700%2Ffilters%3Acachevalid(2020-07-08T19%3A45%3A43)%3Astrip_icc()%3Astrip_exif()%2Feldas%2Fmyassets%2F0251%2F0157_P_0251553.jpg&f=1&nofb=1&ipt=6482091a4de692c0c6fdeebdc5339bd755a810dc6c6488d21cfc8de03f8fa2b8&ipo=images ***** Schiebeschalter *** Visualization (Read/Output) **** Lamp/Light - svg foreground for "lens", simple "ribbed glass" lookalike ? - svg glühdrat? - embedded in 3d structure/detent, with fake reflection spread via colored shadow ? - cutaway side view: ``` |\-=wall . =lens X = lamp __ __ | \__...__/ | X ``` **** Glass Gauge **** Segment Display: http://www.3quarks.com/en/SegmentDisplay/ **** Glass Display effect ? - lens distortion - light reflection from outside - for info-dense ui's that might "break" "tactileness" e.g. graphs