ai newsDo., 15. Okt.
EilmeldungMeta and Apple team up to make Muse AI models run better on Macs

Entwickler baut KI-App, die Gesamtbewertungen mit nachvollziehbarer Begründung liefert

Wer ChatGPT oder Gemini bittet, ein Gesicht von 1 bis 10 zu bewerten, erhält oft wechselnde Ergebnisse ohne Erklärung. Eine neue App kombiniert MediaPipe im Browser mit einem LLM auf dem Server und zeigt nachvollziehbar, wie der Score zustande kommt.

dev.toMittwoch 17:17 · 14.10.DE4 Min. Lesezeit
Bild: dev.to

A lot of young people want to know how attractive they are, so they ask Gemini or ChatGPT to "rate my face from 1 to 10". Ask twice and you often get two different numbers, and neither answer shows how the number was reached. So I built a more methodical rating tool, where the score comes with evidence you can check yourself.

The result is PSL Rating, a small face analysis app. You upload one selfie and get a tier on the PSL scale, a 1–10 score, and measurement lines drawn on your photo.

Measurements run in the browser. I use MediaPipe's Face Landmarker ( @mediapipe/tasks-vision ), which returns 478 landmarks per face, including iris centers. From those points the client computes facial thirds, eye spacing, canthal tilt, jaw width and symmetry, then draws the lines on a canvas over the photo. None of this needs a server, and it's deterministic: the same photo always gives the same lines.

The rating comes from an LLM with a carefully tuned prompt. The photo, a text summary of the measurements and a fixed rubric go to a vision model (Gemini, through a third-party API). The model returns structured JSON, which I validate with Zod before anything reaches the UI. If a field is missing or out of range, that section is dropped instead of invalidating the whole report.

The prompt matters a lot. When the model sees "eye spacing ratio 1.04, canthal tilt +4.1°" next to the image, its comments stay much closer to what the overlay actually shows.

Canthal tilt comes up constantly in face rating discussions. It's the angle of the line from the inner corner of the eye to the outer corner. The most direct way to compute it is:

But that's wrong. If you level the face using the eye line, you rotate away the exact tilt you're trying to measure, and everyone comes out near 0°.

The fix is to correct head roll with a line that doesn't go through the eyes. I use the facial midline, from the top of the forehead (landmark 10) to the chin (landmark 152):

// Roll of the face itself: how far the midline (forehead -> chin) leans from vertical. // Don't use the eye line here, or you cancel out the real canthal tilt. export function rollRad ( px: Pt []): number { const t = px [ LM. FOREHEAD_TOP ]; // 10 const c = px [ LM. CHIN ]; // 152 return Math. atan2 ( c. x - t. x, c. y - t. y ); } export function canthalTilt ( P: Pt []) { // P = pixel landmarks already rotated so the midline is vertical const tilt = ( inner: number, outer: number ) => { const dx = Math. abs ( P [ outer ]. x - P [ inner ]. x ); // y grows downward, so inner.y - outer.y > 0 means the outer corner is higher return Math. atan2 ( P [ inner ]. y - P [ outer ]. y, dx ) * ( 180 / Math.

PI ); }; const right = tilt ( 133, 33 ); const left = tilt ( 362, 263 ); return { left, right, avg: ( left + right ) / 2 }; } Enter fullscreen mode Exit fullscreen mode Two more things to watch out for:

If you just want to try this part, there's a standalone canthal tilt calculator that runs entirely in the browser.

Early testing showed the same person getting very different results from different selfies. The cause was the photo angle: the camera below eye level, a wide-angle lens too close to the face, overhead lighting, a tilted head.

So before rating, the client runs a quick quality check (face size in the frame, head turn and tilt estimated from landmarks, brightness), and the AI also returns a short "photo check" with up to three issues and three retake steps. If the verdict is "retake", the result page says so at the top. That one card probably did more for fairness than any prompt change.

For the live camera, I first built an auto-capture countdown. It didn't work well: the damn countdown kept restarting. Now it's a large oval guide plus a shutter button the user presses themselves.

Face photos are sensitive, so the design principle is to not keep them:

The trade-off is that a user who clears their browser loses the preview images. For this kind of data, I think that's the right call.

If you've built something with MediaPipe or vision LLMs, I'd love to hear how you handled noisy landmarks or inconsistent model output. Feedback on the app is welcome too: pslrating.me.

Originaltitel: I built an AI face rating app that shows its work: MediaPipe in the browser, an LLM on the serverQuelle: dev.to (dev.to). Original öffnen