見出し画像

飲んだお酒の量から酔いの程度を計算する「酩酊メーター」を作った

実際のサイトはこちら:

noteのSEOを借りたいだけのポストでした。以下駄文。


何かを作ってリリースするとき「作りました」と言いたくなるけど、読み手にとっては同じ「そういうのがあるのか」でしかない。どころか第三者の紹介のほうが受け容れられやすい面もあるので今回は言わないでみた。別にバズらなかった。

「その日飲んだ酒の総量を顧みて、純アルコール量や酔いの程度を計算するWebアプリ」というのはサントリーキリン広島県が既に出してるんだけど、いずれも

  • 杯数はちっさい入力欄に数字で打つ

  • 判定ボタンのクリックが必要

  • 典型的な酒以外はまとめて手入力(結局かけ算をさせられる)

  • 大量の小さな文字、視覚イメージの貧困、冗長なインストラクション、縦幅の無駄遣い、、、

と、およそ酔っ払った人間に使わせる気のないモバイルラストな役所UIの煮凝りというか、単なる計算機より体験が悪い。しかもこれらは「お前もお前も飲み過ぎだ」という健康啓発の文脈(酒造会社が何を表層的な)にあるから、何も積み上げてこられなかった人生で唯一積み上がった空き缶の数を数えたいペルソナに合っていない。

ということで、人間のいちばんダメなときでも使えそうな酒カウンターを作った。文字情報と使用工数を極限まで削ぎ落とし、酒デッキは個人の飲酒嗜好に合わせてフルカスタマイザブルにした。習慣的に使えるよう、体重やデッキはブラウザのキャッシュに保存される(カウントは1日放置でリセット)。飲酒量ベスト5を含めたサマリーをツイートするリンクも自動生成する。

残り少ないであろう充電を食わないよう、スタイリングは暗めにまとめた。要素が粗いので嫌いなテクスチャを使わないと間延びしそうだったが、蒸れた夜店をイメージしたshadowの多用によってなんとか耐えた。お気に入りはCSS二行で書けた電飾。

border: dotted .5rem #ffd;
box-shadow: 0 .3rem 2rem crimson, 0 .3rem 2rem crimson inset;
PCだとドットが丸くて可愛い

こういう静的なシングルページは数日で実装できるので長期制作中の息継ぎにちょうど良い。気づけば半年ぐらい沈黙していたので生存報告も兼ねている。来年はいろいろ出せると思います。

以下、作った経緯とか。

ここから先は

479字
500円の買い切りで過去・未来すべての記事の有料部分が丸見えになるぜ!!!!

大西拓磨のこと好きな人向けの情報。近況、思い出話、グロいポエム、新コンテンツのβ公開(テストプレイ募集)とか。

この記事が気に入ったらサポートをしてみませんか?