そららのクリエイティブログ

I LIKE CREATIVE.

【CSSイラスト】ナムナムくんを描いてみた

HTML・CSSでオリキャラ
こんにちはです。あっちのそららです。
今回は、HTMLとCSS(ウェブ制作などで使う言語)で、オリキャラを描画してみました。

描いたのは、うちの子「ナムナムくん」。
「Result」でイラストを確認できます(レスポンシブ対応済)。

単調なデザインと甘く見ていましたが、どっこい。パーツの多さもあり、頭が痛くなるコード量に。特に髪は、地味に複雑な形のため、なかなか思ったとおりにならず悩みました。

正円で髪と口を構成する
髪と口は、複数の円を組み合わせ、一部分を消すことで、一つの線に見えるようにしました。各々の円の位置調整(レスポンシブ込み)が大変。

こういう一筋縄ではいかないテーマは、練習にもなるし、その過程で新たな発見もあったりします。

canvas+JavaScriptのほうが楽そう。

©2017 Sorara Creative Blog