Skip to main content

オーダーメイドのバレエ衣装 nidle.st

オーダーメイドのバレエ衣装 nidle.st
https://www.nidle.net/

久しぶりに個人で作らせていただいたサイトのご紹介。
紹介文らしい、紹介文も書けないのでサイトの簡単な説明と、サイトの技術的な部分を書いていこうと思います。

nidle.stとは

バレエ衣装の衣装をオーダーメイドで作ってくれるサイトです。
もともとはクライアント様の娘さんのために作っていたみたいです。
衣装のクオリティーはとても高く、初めて見た時には大変驚かされました。

技術的なお話

フロントサイド

まずはフロントサイドのお話から、
今回やってみたのがサイトのフルSVG化!
日本のサイトではところどころでSVG使ってサイトは見たことあるのですが、
サイト全体をSVGで作っているサイトは見たことがなく、やってみました。(日本では初?情報持ってる人いたら下さい。)

SVGって何?って人のために簡単な説明を
簡単言うと画像をどんなに引き伸ばしても、ズームしてもギザギザにならないんです。

zoom_nidle

こんなかんじにここまでズームしても画像でよくあるギザギザが一切でません。

製作過程はでは半ピクセルでずれたり、SVG差し替えたら崩れたりと、デザイナー共々非常に苦労しましたが
新しいことをやるという面では非常にいい経験になったと思います。

サーバサイド

次にサーバサイドのお話
サーバサイドもこれまた非常に苦労しました。

ランニングコストを極力抑えたいとのことで、サーバ規模の小さいものを用意したのですが
最初は王道構成のApache、MySQLで作っていたのですが、ストレステストをしたらまーこれが遅くて使い物にならない!
サイトが2秒遅いだけで直帰率が50%アップすると言われているので、こりゃまずいということでサーバを再構築。

結局、NGIN、php-fpm、MariaDBの最速構成に変更しました。。
ストレステスト時のレスポンス速度は20~30倍早くなり、流石NGINXと関心しました。
(サイトの規模からみて完全にオーバースペックなんですけどね。。。)

最後に..

制作に関わった皆様、クライアント様、お疲れ様でした。