ぐぬぬ

未経験からweb業界へ転職を目指す会社員 / 2020.6〜 CFオンライン0期生 /…

ぐぬぬ

未経験からweb業界へ転職を目指す会社員 / 2020.6〜 CFオンライン0期生 / 独学で躓いて止まってしまった分を取り戻すべく日々勉強中です/

最近の記事

サイトレビュー15

アーティストの方のオフィシャルサイトです。 ポートフォリオサイトはシンプルなデザインにしたいと思い、なるべく写真を使っていないサイトやカラフルでないサイトをよく見ています。 Newsの、「ご連絡」「買えます」という見出しが分かりやすいし、あまり見たことがなくて新鮮です。 自分でサイトをコーディングしてみて分かったのは、余白がありすぎると不安になることと、文字サイズの調整が難しいことです。 このサイトに限らずなのですが、意外とフォント小さめでも良いのかーと、自分で作った

    • サイトレビュー14

      西谷デザイン フリーのWEBデザイナーさんのサイトです。 イラストも、スクロールする度に出てくる帽子もひとつひとつ違っていて可愛いです。 制作事例も拝見しましたが、写真のレイアウトや、余白の使い方など勉強になります。 サイトの内容に合わせて違ったテイストの幅広いデザインをされている印象です。こんな風に色んなデザインでサイトを作ってみたい、、! ポートフォリオサイト制作にあたり色々な方のポートフォリオサイトを見ており、久々のサイトレビューとなりました。 投稿は久々と

      • サイトレビュー13

        webや映像制作の会社のサイトでデザインも技術も実績もすごいです。 様々な種類やターゲットの制作をされている印象。 実績のページはページのキャプチャと、特にSP用サイトはSPのイラストに画面がはめこんであるようになっていてイメージがわきやすいです。ポートフォリオ制作の参考にもなります! 完全に落ちていたモチベーションが少し上がりました。笑 目標と期限を再確認して、やるべきことと向き合っていきたいと思います。

        • サイトレビュー12

          レスポンシブコーディング 勉強中のため、ブレイクポイントがあるのか、どういう変化があるのかを見てみました。 ①デジャヴ公式ブランドサイト ・ブレイクポイントはなかった(と思う) ・NEWSとPICKUP部分は、スマホで見てもボックスが横並びになっていて、横にスクロールして見られるようになっている ②株式会社エクスクルシーブジャパン ・ブレイクポイント→960pxになるとメイン画像の表示が変わる ③大成紙器製作所 ・ブレイクポイント→768px ・768px以下

        サイトレビュー15

          サイトレビュー11

          株式会社トリドールホールディングス 採用ページ 丸亀製麺などの飲食チェーンを経営する会社の採用ページ。 うどんが好きなのでつい気になって見てみたが、デザインがモダン、、と思ったら、ハワイアンカフェなどもやられてるんですね。 ●デザインで気になったところ  ・ボタンから矢印がはみ出てマウスをのせるとちょっと動く。  ・ボックスの横並びを上下に少しづつずらしている  ・配色のコントラストがすごい(目立たせたいところが際立っている) また、キャラクター診断やキャリアの

          サイトレビュー11

          サイトレビュー⑩

          株式会社Roots https://rts.tokyo/ 都内のイベントコンサルティング会社のwebサイト。 全編イラストの会社サイトは初めて見たかもしれません。 ・何をしている会社なのか、仕事の流れ、そこで働く方々の説明がイラストを交えており、見やすく分かり易い。 ・イベント実施したい会社をターゲットに会社を知ってもらい、お問い合わせをしてもらうことを目的としている。お問い合わせページにアクセスできるボタンが右上に固定されている。 ・サイト構成は1カラムでシング

          サイトレビュー⑩

          サイトレビュー⑨

          堺名菓 南曜堂  ・どこか懐かしいようなイラストをファーストビジュアルにしており、懐かしい・老舗感・ほっこり感が伝わる。サイトの中では写真も使われており、実際の商品イメージや商品が作られるまでの工程が分かり、バランスよくイラストと写真を使い分けているところが良いと思った。 ・右側にナビゲーションを固定させている珍しいデザインだが、和風のイメージに合っていて違和感がない。サイトの色使いも小豆色でイメージにぴったり! ・和菓子好きの大人の女性をターゲットとしており、商品紹介

          サイトレビュー⑨

          サイトレビュー⑧

          多華味屋  金沢にある甘味処のウェブサイト。 ・ファーストビューが取り扱いの商品を使った写真を一面に使っておりビジュアルが強い。ただ商品の写真を載せるだけでは無く、配置やバランスによって模様のように見えて可愛らしいイメージがひと目で伝わる。 ・「和」の商品イメージに合わせて縦書きのテキストが使われているが、説明書きのテキストは横書きが使われており、サイトのイメージを壊さずに文章の読みやすさも考えられているところが良いと思った。 ・観光目的の女性をターゲットに商品の可愛

          サイトレビュー⑧

          サイトレビュー⑦

          JR東日本 スクール教材でフッターについての話があり、フッターに注目して探したサイト。 サイトによってフッターの役割も違い、 ・ナビゲーション・サイトマップとして ・重要ページのリンクとして ・お問い合わせなどのコンバージョンの導線として ・デザインの調整として などがあるとのこと。 JR東日本のサイトはナビゲーション・サイトマップとして使われているのかなと思う。目的別にカテゴリ分けされていて使いやすくなっている。 今までフッターにあまり注目していなかったが、サイトを一

          サイトレビュー⑦

          サイトレビュー⑥

          ELECOM ECLEAR warm 特設ページ ・流行のイラストデザイン。商品の訴求ページながら、商品写真がほとんど無く、脱力感のあるイラストによってリラックス、癒しを得られそうなイメージを伝えているところが良いなと思った。 また、商品の使い方もイラストで分かりやすく、実際に使用したときのイメージが持ちやすくなっている。 ・デザインのこだわりはイラストに合わせたフォントやフォントの配置、 ↓のようなほわっとした効果もサイトのイメージに合っていて効果的だと感じた。 ・冬

          サイトレビュー⑥

          サイトレビュー⑤

          セイコータイムシステム株式会社 https://www.seiko-sts.co.jp/ ザ・コーポレートサイトといったきっちりとした作り。 ・目的別に必要な情報をすぐに探せるよう誘導できるようになっていてwebサイトを見る人のストレスを少なくしているところが良いと思った。 ・製品を探している、製品の納入事例を見て参考にしたい、修理・サポートを受けたい法人向けに問い合わせをしてもらう、見積もりをとってもらうことを目的にしていると思った。 ・マウスホバーなどの効果もや

          サイトレビュー⑤

          サイトレビュー④

          T4 BUILDING OSAKA 大阪にあるオフィス&コミュニティビルのwebサイト。 ・オフィスの外観や内装を洗練された写真やレイアウトで魅力的に伝えているところが良いなと思った。 ・テナント探しをしている人をターゲットに、テナント内の雰囲気や具体的な用途、設備の案内や賃料(キャンペーン価格を目立たせている部分もあり)をアピールし、まずは問い合わせ・内覧をしてもらうことを目的としていると感じた。 ・こういう写真とテキストボックスが少し重なっているデザインは流行りな

          サイトレビュー④

          サイトレビュー③

          Y'sデンタルクリニック ・良い意味で初めは歯科医院のwebサイトとは思わなかった。ターゲットを明確に絞って女性の写真を大胆に使い、歯科治療の「痛い」「怖い」というマイナスイメージから「治療をすることで美しくなれそう」というプラスのイメージを持てるようになっているところが良いと思った。 ・1カラム構成。スマホで見た時のナビが見やすい↓ ・審美治療に興味のある大人の女性をターゲットに、治療の内容や症例を詳しく載せており、予約や問い合わせをしてもらうことを目的としていると感

          サイトレビュー③

          サイトレビュー②

          ニセコリゾート観光協会 公式サイト ・観光協会のサイトということもあり、サイトギャラリーを見ている中でもトップページの写真が特に目を引いた。季節によってページの写真を変えている模様。写真だけでもニセコに興味が持てるようなインパクトがある。 ・観光モデルコースのページでは「食べる」「アクティビティ」「買い物」などの目的別からも探せるのでより見たいページにアクセスしやすくなっていてわかりやすいところが良いと思った。 ・サイト構成はトップページにメニュー内容の概要あり。各ペー

          サイトレビュー②

          サイトレビュー①

          みなとみらい総合法律事務所 https://mmslaw.jp/ ・法律事務所のサイトですが硬くなりすぎず、シンプルで見やすい。 ・どのページにとんでもコンタクトページへアクセスできるようになっており気軽に相談がしやすいように工夫しているところが親切で良いと思った。 ・サイト構成はトップページにメニューバーの概要が盛り込まれており詳細ページへとべる。メニューからも各ページへとべる。 ・法律相談、事件相談をしたい人をターゲットとし、取り扱い案件や料金、弁護士の紹介などを載せて

          サイトレビュー①

          バナー模写まとめ

          先週から始めたバナー模写の記録です。 ①Adecco ②楽天カード ③モイスチュアライザー ④ナースではたらこ ⑤プロアクティブ ⑥午後の紅茶 ①②はスクール教材でレクチャー動画を見ながら作成。 ③はオンライン授業にて作成。 ④⑤⑥はバナーギャラリーサイトなどから選んで1から作成。 どんな風に効果をつけているのか分からないものは調べながらなんとかやってみました。 引き続きトレースと、本日の授業で習ったリサイズもやってみます。 あとはオリジナルバナーにも挑戦したい

          バナー模写まとめ