Webデザイン初学者がシナカフェコンペに全力で参加した

WEBデザイン

こんにちは!しかたです

9月活動報告で「クリエイターズ・シナジーカフェに入会した」とお伝えしましたが、毎月開催されるクリエイターズ・シナジーカフェのコンペ(通称シナカフェコンペ)第1回にて、ありがたいことに最優秀賞をいただくことが出来ました・・・!

しかた
しかた

感無量です・・・!

ブログを始めてそれほど経っていませんが、作品制作にあたって以前から変わったこと、以前より気をつけたことが増えてきました

なので、今回は備忘録として作品制作過程を投稿したいと思います

  • 「クリエイターズ・シナジーカフェってどんなオンラインコミュニティなんだろう?」
  • 「気になるけど、入会までの1歩が踏み出せない・・・」

そんな思いから、この投稿を読まれてる方はこちらをどうぞ

しかた
しかた

初学者としての意見となりますが、良かったら参考にしてくださいね

それではいってみましょう〜



スポンサーリンク

Webデザイン初学者がシナカフェコンペに全力で参加した結果がこれだ!!

シナカフェコンペは月1開催される、初学者専用の自由参加型コンペです

運営メンバーの皆さんから毎月出されるテーマに沿って制作します

しかた
しかた

この時のテーマは『門出(シナジーカフェの門出にふさわしいデザイン)』でした

実務をする上で重視すべき点を審査項目として設定してくれているので、しっかり意識して制作に取り組めば、コンペに参加しながら成長できるという初学者にはありがたい企画となっております

第1回の内容や参加された方の制作物についてはこちらをご覧ください

しかた
しかた

素敵な作品ばかりですので要チェックです!



制作過程

制作過程については、当ブログの初投稿記事からあまり変わっていません

初投稿記事では図解つきで説明しているので、詳細が気になる方は良かったらご覧ください

ざっと時系列で表すとこんな感じです

  • 情報収集(約1時間)

    制作物のサイズやテーマについて調べたり、考えたりする

  • noteヘッダー画像 作成(約3時間)

    素材探しをしながら作成したので実質2時間ぐらい

  • noteヘッダー画像 微調整(約1時間)
  • noteアイキャッチ、Twitterヘッダー画像 作成(各約1時間)

    noteヘッダー画像からリサイズしていく

  • noteアイキャッチ、Twitterヘッダー画像 微調整(各約1時間)

ここからは作品制作にあたって以前から変わったこと、以前より気をつけたことを深掘りしていきたいと思います



変わったこと、気をつけたこと

1.情報収集をより深く行う

デザインする物の事をたくさん知って、依頼してくれた方に精一杯向き合う必要がある」とDLLの課題やシナカフェを通して痛感したので、以前に比べて情報収集を深く漁るようになりました

実際に取り組んだのはこちら
  • テーマ『門出』について「旅立ちと何が違うのか?」など調べたり・・・
  • デザインアイデアのストックが少ないので、PinterestやGoogle検索で出てくる画像からテーマに関連するデザインの傾向をググったり・・・
  • Twitterやnoteの画像はサイズはもちろん、掲載するにあたって注意すべき点も調べたり・・・ など
しかた
しかた

シナカフェ利用者としてこの企画で伝えたいこと、運営メンバーさんに取ってこの企画で伝えたいことなども自分なりに考えてみました!


2.手に入れた知識や大切にすべきこと、ラフを考えて紙にまとめた

以前まではラフは「iPadなどで書けばいいや〜」と思っていて、情報収集も浅く、記録も残していなかった しかた

最近は調べたことや考えたこと、ラフは紙に書いて残すようにしています

しかた
しかた

手を動かすことで印象にも残りやすいし、記録を残して置くことで詳細などを忘れてしまった時に調べる手間が省けます

実際書いた物の一部はこんな感じです

しかた
しかた

字が汚いのは目を瞑ってください・・・!

私はめちゃくちゃ心配性なので「これであってるよね?」「大丈夫だよね!?」という気持ちからくる情報の見直しが多いのですが、紙にまとめてしまえば参考にしたネットページを都度見返す必要がなくなるので、そういった点もメリットですね


3.文字の視認性や配置のバランス、トーン&マナーを意識した

当たり前のことなのですが、文字同士の余白の大きさや文字を揃える位置などをもっと意識するようになりました

最優秀賞を獲得した方は1ヶ月間、シナカフェ(@Synergy_Cafe)のTwitterのヘッダー画像、noteのヘッダー画像、コンペのサムネイル画像をジャックできる

この点がシナカフェに参加されてない方でもわかるように「3つの画像を作る」というよりは「noteのヘッダー画像からそれぞれの画像にリサイズする」と思って制作していたので、それぞれの画像の統一感についても考えます

しかた
しかた

意識してても忘れちゃうので、ガイドを引きまくって目に見える形にしてましたね〜

「ヘッダーやアイキャッチの雰囲気が気に入ってサイトを覗いたら、違うテイストだった」というのも避けたかったので、シナカフェ本来のトーン&マナー(雰囲気やコンセプトに一貫性を持たせること)を崩さないようにも注意しました

フォントに関しては同じくシナカフェ参加者のまめさん(@mamehiro25)のこちらの記事がとても参考になりました

「このサイトのフォントを使ってみたいけど、名前がわからない・・・」とお困りの方には必見です


番外編:他人に見てもらう

これは番外編というか、いつでも出来るわけではないのですが「第3者の目」って大切だなと思って、他人(主に夫)に見てもらうようになりました

いろいろ考えながら作業していると独りよがりなデザインになりやすいし、私はまだまだ「何が良いデザインか」をわかっていないので、前情報も何もない夫に見てもらって、違和感をあげてもらっています

しかた
しかた

デザイン知識を持っていない人の意見なので、参考になる点が多いです



スポンサーリンク

反省点・改善点

  • SNS流入(何を伝えたいか、大切なことは何か など)を意識
  • シナカフェ本来のトーン&マナーを意識
  • デザインのバランスを意識
  • 各媒体、画像毎の視認性を意識 など

いろんなことを意識しながら頭がパンクするまで考えて提出した制作物でしたが、まだまだ意識できてない点も多々ありました

しかた
しかた

入賞すれば運営メンバーさんからフィードバックしていただけて、更なる成長に繋げられるので、そういった点もありがたい!

特に指摘していただいた容量について

サイトを快適に見れるようにするために画像の容量は少なければ少ない方が良いとブログ運営して知ってたはずなのに、全く意識していませんでした(汗

この件に関してはこちらの記事がわかりやすかったので、気になる方は要チェックです

個人的に調べた所感では

  • 1つの画像あたり125KB〜150KBぐらいが望ましい
  • ブログなどの画像は極力50KB〜100KB、ゆるめに設定しても200KB〜300KB

という意見が有力そうです

しかた
しかた

間違ってたら教えてください・・・!

また、作品完成時に時給換算してどれぐらいになるか考えるようにしてるのですが、今回時給1000円で考えると、

  • 情報収集…1000円
  • note ヘッダー…4000円
  • リサイズ(と考えて換算)
    • Twitterヘッダー…2000円
    • note アイキャッチ…2000円

クラウドソーイングなどではリサイズ1つにあたり3000円ぐらいが妥当なイメージ

しかた
しかた

そこで1000円ずつ多めに利益をあげれると考えたら妥当な作業量かな?

一瞬そう思ったのですが、案件提案時に何パターンか提出しないといけないことを考えたら、今の半分の作業量にしないと厳しいと思い返しました

ここもまだまだ改善点です



結果はこんな感じでした

まだまだ課題点・考えることがいっぱいですね〜

今後も頑張っていきたいと思います

ここまでみて下さってありがとうございました!

またお会いしましょう〜


コメント

タイトルとURLをコピーしました