kamiのサービス制作ログスマートフォン用の表示で見るkamiのサービス制作ログひとりでサービスを制作している人の作業ログ的なブログこの広告は、90日以上更新していないブログに表示しています。Bookmarks」をリリースしました。サービスのランディングページを中心とした、Webサイトのデザインをまとめたサービスです。つくったひとことでいうと、Webデザインの勉強をしたかったけど、自分が好きなデザインが集まったサービスがなかったのでつくりました。いくつか同様のサービスはありますが、どちらかというとコーポレートサイト中心で、Webサービスしかつくらないぼくにとっては十分ではありませんでした。このサービスは「Webデザイン制作に関わるすべての人に、最高のインスピレーションを与えること」をミッションに制作しました。そのため、ページ上に余計な情報を表示せず、デザイン閲覧に集中できるようなデザインにしています。今回は以下の技術を用いて開発しました。AdminとPaperclipです。Adminを用いました。Admin上でPaperclipを用いて写真をアップロードしています。ページ上では、以下のようにサムネイルも表示するようにしています。この辺りはコードを数行書くだけで実装できるので、とても便利だと感じました。他のサービスでも積極的に使っていきたいです。Flowで開発しました。以下の流れで開発しました。branchを切るファイルを編集するbranchをpushBitbucket上でプルリクエストを作成するレビューするOKならマージ、NGなら修正&再度commitローカルでmasterをpull&マージ済みbranchを削除する自分なりのレビュー時のチェックリストもつくり、努めて客観的にレビューしました。マージしたら自動でJenkinsでデプロイパイプライン(テスト→デプロイ)を回すようにしています。手間はかかりましたが、コードの品質は上がったような気になれます。本当は、以下の流れでスクリーンショットを撮りたかったです。Admin上でステータスをpublishにすると、サービスに反映されるただ、2のスクリーンショット自動取得の検証段階で、どうしても日本語が豆腐文字になる問題が解決しませんでした。試してみたのはPhantomJSやwkhtmltoimage、Pythonのwebkit2pngなどです。仕方ないので、今はMacのGUIでポチポチ作業しています。PhantomJSのv2.0が出て、そこで解決するようなissueも見た気がするので、もう一度トライしてみます。負荷ご想像のとおり、画像を多用しているため負荷がすごいです。画質を荒くするのも手なのですが、やはりデザインのクオリティは一番こだわるべきところだと思いました。一応ImageAlphaで圧縮していますが、根本的な解決にはなっていません。この辺り、様子を見ながら対策をとります。おわりに今回、規模が小さかったこともあり、制作期間は5日間でした。サービスは今回で5つ目ですが、初めて最初に引いたスケジュールどおりにリリースできました。今は技術習得のために新しいサービスをどんどん作っていますが、10月あたりからは作ったサービスをしっかり運用する段階に入りたいです。ツイートはてなブログをはじめよう!kami30kさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。