二案(最終案)デザインの変遷bageleeのロゴリニューアルしてみてこの度、bageleeは2019年1月11日にフルリニューアルを行いました!以前のデザインもヘッダー、コンテンツ、フッターと要素が綺麗にまとめられており、見やすくわかりやすい形に構成されていました。今回のリニューアルしたデザインにはさらに遊び心やメディアらしさといったエッセンスを加えています。リニューアルに向けてリニューアルの構想を決めたのは2018年5月ごろ。目的とコンセプトを決めるところから始まりました。ワイヤーフレームを作成しました。bageleeの運営会社であるエイシスのデザイナー皆で打ち合わせを週一行い、各々でフィードバックを受けたりもらったりした全体的なワイヤーの形となったのがこちら。全体の構成図が決まり、いよいよデザイン制作にはいります。CloudやSlackベースです。今回はちょっと特別に初期案のデザインも載せられたらと思います。初期案のデザインはこちら。コンセプトとしてあげていた「かわいい」「おいしい」「わかりやすい」に重点をおいたデザインを作成しました。ヘッダーのガーランド部分はベーグルと合わせたパン屋さんをイメージしています。ところどころにbageleeのイメージキャラクターである「べぐまるくん」たちを登場させたり、見出し部分をリボンの形にしたりと「かわいい」にも重きをおいています。「わかりやすい」要素として大きなブロック要素を背景色(ベージュ/白)と分け、要素のグループ化を図りました。各コンポーネントの色はモノクロでありながらも記事のサムネイル画像であったり、キャラクターたちの登場によってどこか遊び心のあるキュートなデザイン!ということで作成したデザインでした。フィードバック女性受けは良いかもしれないけれど、男性がこのページを訪れたときに「ちょっとこのブログは自分には合わないかな...」という心理が動いてしまいそう。良い意味でも悪い意味でもいただいた「可愛すぎます...!」というフィードバック。現在のbageleeの訪問者では男女比が偏っているわけではないため、この案の場合は今までみていた男性ユーザーが戸惑ってしまうのでは?というフィードバックをもらいました。遊び心でいれたべぐまるくんたちの主張が少し激しいので、そっちに目がいってしまうのではないか、というコメントも。背景色として使っているベージュも女性観点に寄っているということでした。確かのこのデザインでは「かわいい」に振り切ってしまっています。形の構成はこちらで問題ないということだったので、カラーリングであったり遊び心をもう少しだけ控えめにすることを決めて再度作成。二案(最終案)最終案がこちら。所々はブラッシュアップをしていますが、現行のデザインとほぼ形は同じです。各コンポーネント部分をシンプルにしています。シンプルだけどどこか可愛い、さりげない「おっ!」となるような雰囲気を出しました。遊び心は残しておきたかったので、アクションとしてべぐまるくんたちを登場させることにしました。背景色をベージュからブルーよりのグレーに変更しました。男女共に来やすいページを心がけ、控えめな無彩色にしました。全体的なデザインの変遷です。構成決定案の前に実はもっとラフのワイヤーがあったり、デザイナー陣のデザインコンペ案などあったりしますが、ざっくりとした変遷がこちらになります。どのデザインも作るのがとっても楽しくて作っている時間はほんとうにあっという間でした!また、要所々でアクション(マウスオーバーや時間経過など)を起こすとぴょこっと出てくるべぐまるくんたち。コーディング・フロント実装を担当していただいたデザイナーに感謝です...!bageleeのロゴロゴも一新しています。以前のデザインではヘッダーに丸みを感じさせられるフォントを使ったロゴでした。ベーグルをイメージできる「ころころっ」としたとっても可愛いデザインでしたね。eishis」にいれているのも理由があります。会社の知名度もあげる、ということが一つのリニューアルの目的であるのでブログ内のロゴにはこちらのキャプションを入れています。文字の形もシンプルだけれど丸みは感じさせたい。以前のデザインも踏襲しつつ選定しました。以前は「a」の部分が他の文字にみられてしまいそうだったので、そこだけ変えています。みたときに「bagelee」という文字に見えるのを第一に文字の太さであったり、ひとつひとつの英字の文字詰めを整えました。リニューアルしてみてリニューアルして終わり、ではなくリニューアルしてみて気になったことや改善は随時社内で共有し、改善に努めていこうと思っています。ユーザーからのお問い合わせや要望をもらった場合も前向きに検討していきたいです。デザイナーSketchだいすきプロダクトデザイナー。シンプルだけどちょっとかわいいデザインが得意。好きな食べものは生ハムとお寿司とカレーです。関連記事アプリでもっと便利に!気になる記事をチェック!記事のお気に入り登録やランキングが表示される昨日に対応!毎日の情報収集や調べ物にもっと身近なメディアになりました。palanでは一緒に働く仲間を募集しています正社員や業務委託、アルバイトやインターンなど雇用形態にこだわらず、ベテランの方から業界未経験の方まで様々なかたのお力をお借りしたいと考えております。マーケター・ディレクター・エンジニアなど何でも屋。COBOLからReactまで色んなことやります。デザイナーアメリカの大学を卒業後、日本、シンガポールでデザイナーとして活動。デザイナーWebAR/VRのデザインと3DCG制作がメインです。肩書きは「アニメ案件に関わりたいデザイナー」。マーケタードイツでWEBマーケティングしています。使ったサーバーレスアーキテクチャを担当しています。元々はインフラとかPHPをやっていました。デザイナーフロントエンドデザイナー。CSS、JSの実装を担当しています。NativeやReact360をよく触っています。エンジニアサーバーサイド、フロントエンド、Unityと色々手を出してる雑食系エンジニア。ReactNativeが最近のマイブーム。デザイナーSketchだいすきプロダクトデザイナー。シンプルだけどちょっとかわいいデザインが得意。好きな食べものは生ハムとお寿司とカレーです。エンジニアサーバーサイドエンジニアからフロントエンドエンジニアになりました。Nativeでのアプリ開発をしています。エンジニアサーバーサイドエンジニア。SIerを経て2019年7月に入社。Railsを使った開発を行っています。WebGLとReactが強みと言えるように頑張ってます。DamienWebAR/VRを中心に企画やディレクションやエンジニアもちょっとやっています。TOP運営会社お問い合わせプライバシーポリシーは株式会社palanの運営する情報メディアです。おいしいデザイン・プログラミング情報をお届けします。クリエイター向けの記事を可愛く更新中!。