TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Realtime Responsive Typography Based on Viewing Distance via Webcam

254 pointsby tblancpainover 12 years ago

31 comments

Wintamuteover 12 years ago
Cool experiment! But maybe I'm not understanding something. When a human can't see an object in sufficient detail they lean forwards to increase its apparent size in their optical field. This breaks that fundamental interaction. When you lean forward it stays the same size. Argh! In other words if your eyes are good enough to read the large text, they'll be good enough to read the small text when you lean in - nothing has changed, the system maintains the text's apparent size. If on the other hand your eyesight isn't good enough to read the large text leaning in won't help!
评论 #5201898 未加载
评论 #5201779 未加载
评论 #5203492 未加载
fredleyover 12 years ago
Great idea, a couple of small improvements would make it even better:<p>* Use a moving average, to avoid flickery transitions<p>* Animate the text to the target size rather than changing in steps. This would mitigate the flickering problem too.
评论 #5201672 未加载
DoubleClusterover 12 years ago
Neat, but this completely ignores the real reason people have trouble with small fonts: bad eyesight. The size the font needs to be is a factor of distance and eyesight. The real solution is to just use the default font size and have users adjust that to their preferences.
评论 #5201560 未加载
评论 #5201557 未加载
mjnover 12 years ago
Neat, clicking through the attributions, Headtrackr (<a href="https://github.com/auduno/headtrackr/" rel="nofollow">https://github.com/auduno/headtrackr/</a>) by auduno of Opera Software looks quite useful. That's in turn based on ccv (<a href="https://github.com/liuliu/ccv" rel="nofollow">https://github.com/liuliu/ccv</a>), which I knew about, but Headtrackr looks much nicer to use if you just want headtracking out of the box. It does some trigonometry, based on some assumptions about field of view, to provide the 3d coordinate estimates needed for demos like this, whereas ccv focuses on object identification/tracking within the 2d image (and is much more general, so more complex to use out of the box).<p>The Headtrackr guy also put up a demo of a game controlled using head movement: <a href="http://www.shinydemos.com/facekat/" rel="nofollow">http://www.shinydemos.com/facekat/</a>
daralthusover 12 years ago
Great idea, however you should use a transform rather than font-size, so the line breaks won't change.
burpeeover 12 years ago
Cool, another potential tool against poorly readable sites. I just created <a href="http://cantheysee.it/" rel="nofollow">http://cantheysee.it/</a> for web developers to (roughly) simulate and test for users with poor eyesight.
评论 #5201408 未加载
lifeisstillgoodover 12 years ago
And this is the answer to the "race against the machine" - how will automation that is destroying jobs provide value no-one ever thought of.<p>Total "cat-flap" moment - its not something you ever think of, but once you see it, its obvious.
columboover 12 years ago
I don't have a webcam installed on this machine so I can't test the implementation but what a BRILLIANT idea. This is exactly how cellphones should work; judge distance and then resize the reading pane to accommodate.
评论 #5201479 未加载
edentover 12 years ago
Brilliant! Couldn't get it running in FF, but works like a dream in Chrome.<p>Very useful for interfaces which may run on, say, a TV. Knowing the physical size, or the viewport dimensions, doesn't tell you how far away the user is.
评论 #5200980 未加载
评论 #5201271 未加载
worldsayshiover 12 years ago
I'm mostly impressed by the image analysis. Performance and the fact that it runs on javascript. Well I've heard of ccv.js before but not seen it's capabilities for pixel analysis. Now I have even less excuses to reimplement that broken real time image analysis app that I made for my bachelor thesis.<p>Hmm, there are no explicit licence terms in the repositories of ccv or headtrackr though. :/
评论 #5201332 未加载
gojomoover 12 years ago
Neato!<p>Does the emerging browser camera support allow requesting permission for a single snap (to calibrate distance) as opposed to constant-video?
评论 #5216538 未加载
bluetideproover 12 years ago
This is really awesome, although a bit spastic at times. I'm not sure if this is the proper way to use this concept, but I could see how this concept could be used in similar fashions for setting settings. Like set it once, and then have that size apply to whole site or something. Either way, never clever idea, and well done! :)
mcintyre1994over 12 years ago
Cool experiment! It works especially well if you substitute a face for an optical illusion poster (<a href="http://www.popartuk.com/g/l/lgpp0906+cogs-twisting-cogs-mind-warp-illusion-poster.jpg" rel="nofollow">http://www.popartuk.com/g/l/lgpp0906+cogs-twisting-cogs-mind...</a>)<p>In all seriousness, it seems to lock onto that poster quite often.
AUmryshover 12 years ago
This is awesome. The algorithm seems to have some trouble with glasses and headphones, but works pretty well otherwise. It's such a simple idea, and with the new web technologies becoming widespread, I expect that we will see more of this sort of thing in the future.
mladerover 12 years ago
This is very neat!<p>The main issue I could see implementing this is that you'd have to constantly get permission from the user to use their webcam. I'm not sure I'd trust a site to just use my mug for improved readability.<p>Could be great for games though!
Skoofooover 12 years ago
The face tracking didn't work well at all for me. Maybe I have an odd face.
评论 #5201585 未加载
maratzover 12 years ago
Hi everyone, thanks for your feedbacks! :)<p>More ideas <a href="https://twitter.com/markodugonjic/status/301013228463476736" rel="nofollow">https://twitter.com/markodugonjic/status/301013228463476736</a>
jhgaylorover 12 years ago
This is really slick. I think it'd be great as a browser plugin so I could use it almost like an accessibility tool on sites with horrid typography. It seems better than cmd++.
mrdubover 12 years ago
Nice, I built something similar with a buddy using a kinect a couple month ago. Think poster not website.<p><a href="http://youtu.be/Xy8oRmoV8Ag" rel="nofollow">http://youtu.be/Xy8oRmoV8Ag</a>
trumbitta2over 12 years ago
Nice experiment...<p>If only my laptop-mounted webcam wasn't next to me instead of in front of me together with my laptop 'cause I always use it with external monitor, keyboard, and mouse :p
zekenieover 12 years ago
That's so cool! I wonder if anything like this will ever be standard. I imagine people would be creeped out if their webcam was always on, but its a really cool concept.
brianbreslinover 12 years ago
This is pretty cool! does something like this exist for eye-tracking? i.e. have it zoom areas of text you are looking at? could be great for people with poor vision
jastantonover 12 years ago
I took it one step further and integrated rotation into the mix:<p>check it out. <a href="http://codepen.io/JAStanton/pen/meDLB" rel="nofollow">http://codepen.io/JAStanton/pen/meDLB</a><p>too far?
评论 #5204223 未加载
sciencerobotover 12 years ago
This is an impressive demo however I usually move my face closer to the screen because the font is too small.<p>It would be neat to see a demo of parallax using a webcam.
评论 #5201498 未加载
MrDroneover 12 years ago
Cool idea but it just blew up the font to an unreadably huge size for me. Using an external camera mounted on the monitor in front of me.
synorover 12 years ago
What do you have to assume about e.g. user monitor ppi and webcam field of view to make this work?
kumarharshover 12 years ago
Wow! Just WOW!!! Although, of course, there is a lot to improve, like jittery zooms.<p>Love the idea though!
gregwebsover 12 years ago
very neat. Perspective bug: nodding your head down or up or turning it to the side makes your face appear smaller to the camera which will increase the text size.
blikerover 12 years ago
oh please, someone make a extension for chrome so I can scroll just by nodding. Thank you!
FraaJadover 12 years ago
how does one enable webcam for this to work?
Uchikomaover 12 years ago
Just wow