器であることを、選んでいる。
空にしておく、という仕事。
EmptyCoke という屋号は、「自分の色がない」という意味ではありません。
お客さまのアイデアが入るはずの場所を、こちらの好みで先に埋めてしまわないための決めごとです。
そのため打ち合わせでは、作りたい画面の話より先に、誰に何を届けたいのかをうかがいます。
手を動かすのは一人ですが、決めるのは一人ではありません。
ロゴも同じ考え方で作っています。「EMPTY」は塗りつぶし、「COKE」は輪郭だけ。空になった器に、これから何かが注がれる、という意味を込めています。
- 屋号
- EmptyCoke
- 拠点
- 大分県
- 事業形態
- 個人事業
SERVICE
-
01
Web サイト制作WEB SITE
企画から公開後の更新まで、必要な範囲だけお引き受けします。
設計デザインコーディング保守 -
02
EC サイト構築EC SITE
商品ページや購入の流れを、お店の方の言葉に合わせて作り直します。
テーマ開発商品ページ計測 -
03
WordPress 開発WORDPRESS
テーマを一から自作し、誰がどこを更新するかまで決めてからお渡しします。
フルスクラッチ移行運用設計
※ Web アプリや SaaS の新規開発は、お受けしていません。
新しく作る前に、今あるサービスで足りないかを一緒に確かめます。
進め方の四つの段階と役割分担は事業内容に、見積りが何で上下するかは料金・見積りの考え方にまとめています。
COLOPHON
これまでお引き受けしてきたのは下請けの案件のみで、お見せできる実績がございません。代わりに、このページがどう作られているかをお見せします。
ページ上部の映像は、three.js で作った、12.2 秒・全 4 章の映像です。
-
01 — STILL LIFE
机に置いた一本を、そのまま撮った場面です。瓶の形は、断面の座標を回転させて作る LatheGeometry で描いていて、外部の 3D モデルは読み込んでいません。
-
02 — DRINK
液面が下がっていく場面です。ガラスは MeshPhysicalMaterial で表現し、中身は平面で切り取って高さを決めているので、飲み干す速さを数値ひとつで変えられます。
-
03 — IDEAS
空になった瓶に、色が注がれる場面です。舞い上がる電球は InstancedMesh で、同じ形をまとめて一度に描いています。泡の粒は 320 個です。
-
04 — YOUR COKE
まだ名前のない一本が残ります。内側から光る表現だけは既製の素材では出せなかったので、短いシェーダーを自作しています。
- ライブラリ
- three.js 0.160.0importmap で CDN から直接読み込んでいます。バンドラーは使っていません。
- ビルド
- なし素の ES modules のまま配信しています。納品後に誰かが一行だけ直したいとき、すぐに直せるようにするためです。
- フレームワーク
- なしこのページはほとんど状態を持たないため、状態を管理する仕組みを入れる必要がありません。
- 動きを減らす設定
- 最後の場面から表示端末の設定で動きを減らしている方には、映像を飛ばして、完成した場面からお見せします。
ここに書いた数値は、すべてこのページのソースコードで確かめられます。映像を最初から見る
この作り方でつまずいたことは、制作ノートにまとめています。
席がひとつ、空いています。
手を動かすのが一人でも、決める場面には、二人以上いたほうがいいことがあります。
フロントエンドを一緒に担当してくれる方を探しています。案件ごとにお声がけする形で、こちらの手が回らない部分をお任せしたいと考えています。
見た目の仕上がりを良くする話と、半年後に触る人が読みやすいコードにする話の両方ができる方だと、うれしいです。
- 関わり方
- 案件ごとの業務委託です。常駐や稼働時間の縛りはありません。
- お願いしたいこと
- HTML・CSS・JavaScript での実装と、実装の立場からの設計レビューです。
- 働き方
- リモートのみです。打ち合わせもオンラインで行います。
- 応募
- 制作物を見られるURL を添えて、info@emptycoke.com までお送りください。
応募後の流れと、お断りする条件は、パートナー募集の詳細にまとめています。
WHAT'S YOUR
FLAVOR?
まだ名前のない味を、
どう作るかから一緒に考えます。
- やりたいことサイトで実現したいこと
- 公開したい日決まっていなければ、目安で構いません
- ご予算幅があっても構いません