【第9回】未経験でも大丈夫!Webデザイナー志望の方へデザインノウハウをアウトプットします!




中の人
こんにちは。
気温が下がると頭痛がひどくなるcoffeebreakの中の人です。

この記事は未経験の人や新米Webデザイナーさん向けに、デザインノウハウの記事を探しtwitterでツイート。また探してきては一人で「お宝記事!」と喜んでツイートを繰り返し、後日ブログで定期的にまとめるというtwitterのつぶやきを二次的に活用したちょっとせこいコーナーです。一応過去に試した事があるもの、経験になったノウハウを中心に共有しているので良い様に捉えるとアウトプットという形ですね。

今回で第9回目のアウトプットです。もうすぐ記事紹介が100ツイートを越えます!
Webデザイン役立つノウハウは沢山あることがよくわかりました。

今回は引き続き技術的な情報としてCSSの見落としがちな事を中心にツイートしていました。ところがまぁ、人気が無い事!後半はやっぱりデザイン関係のツイートで「デザインの上達法」について上手くまとめている記事を紹介しています。

さっそく確認していきましょう!

前回の記事はこちら
第8回twitterアウトプット記事

中の人
いろんな記事をみたのと、私の経験からピックアップした記事をツイートしたよ。

フォロワーが良いと評価したデザインノウハウの紹介

最初の記事
実務経験3年すぎた現役Webデザイナーのリアル【勉強方法編】 – IT系女子ログ

概要
ツイートには私の見出しも加えてみました。

<ツイート見出し>
【お宝記事!】デザイン編とコーディング編を1本にまとめたボリューム満点の記事 (´,,•ω•,,`)これ、全部やりこんだらデザイン力はかなり上がりますね(´,,•ω•,,`)

<コメント>
記事主さんの文章量が半端ないよね〜。あと見出しが多い!という事はそれだけご自身が試したお題があって、それが有益だったという事ですよね。
中にはちょっとした合間でもできそうな項目もあるので、できる事が真似してみるのもいいのかなと思います。
この記事を振り返ってみたけど、各項目を1週間実践して「◯◯を試して気づいた事」でデザイン記事が書けるなぁ。やってみよっかな〜。

次の記事
【7選】photoshopで作るドロップシャドウのツボとコツ!未経験でもワンランク上のWebデザイナーを目指す方法

概要
ツイートには私の見出しも加えてみました。

<ツイート見出し>
ドロップシャドウの記事を書きました。濃い薄いシャープな影とか色々用意したので影の作り方が「苦手だな」と思う人は是非真似してください!あとPSDのDLできます!

<コメント>
あ、自分の記事ですね。twitterに投稿しているデザインをみていたら、どうもフォトショップの効果を駆使してないよな〜と気づいたので、熱が冷めないうちにドロップシャドウの記事を書きました。すっごい基本的な表現ですが、これだけ覚えると結構活用できるのです。これからWebデザイナーを目指す人、目指している人、まだまだ新米の人はぜひ身につけていただきたいと思います。

評価されたデザインノウハウについて

デザインの上達法の記事はスキルアップに直結する内容が書かれているので、いいねやリツイートをたくさんつけてもらえました。
このような記事をもっともっと探しきて公開していきたいと思います。

同じ期間中にツイートした残りのデザインノウハウ記事の紹介

ご自身にプラスになりそうな記事があれば覗いてみてください。
皆さんの技術向上につながればと思います。
※ナカグロは私のツイート見出しです

HTML/CSSの落とし穴!?初心者向け覚えておきたい基本ルール5つ – Noise of Web Programming
・CSS優先順位のおさらい記事です。簡単な内容ですが、資格試験とかで似た問題が出題された記憶があります。知ってるつもりにならず、おさらいのつもりで読んでみましょう。

HTML/CSSの落とし穴 ~知らないと15分損するTips集
・【豆知識】なんでもできそうなCSSだけど、この記事ではあえてできない事にフォーカスして紹介しています。「あれ?動かない!」は実は「仕様」なのかもしれません!

意外な落とし穴!?CSSコーディングにおける iPhone での注意点・3つの事例 | SiTest (サイテスト) ブログ
・【参考に】CSSとスマホの仕様を知らないでデザインすると後で深い沼に入り大変という事をあらためて再認識しました。

Vue.jsでドラクエ風のポートフォリオを作った話
・ドラクエ風ポートフォリオの記事 (´,,•ω•,,`)実力見せるには良い企画かもしれませんね。でも、html、css、jsで似た事は出来そうだけど実装するには難易度高いか。

[CSS] 子要素の上下marginが効かなかったり親要素marginに影響するのは困るので、阻止する。
・子要素の幅がでかすぎて親要素の幅が効かない時の対処法 (´,,•ω•,,`)CSS描き慣れない時はそく遭遇するヤツなのでチェックして見ましょう (´,,•ω•,,`)

実務経験3年すぎた現役Webデザイナーのリアル【勉強方法編】 – IT系女子ログ
・【おすすめ!】デザイナーとしての覚悟とか自責とかある程度自分を追い込む時期は必要。折れない心はそうしないと身に付かない。

残りのデザインノウハウ記事について

今週の記事の中ですっごく興味があったのがドラクエ記事です。ポートフォリオにアクセスするとドラクエ風の画面と会話形式でユーザーのスキルや実績紹介をしてくれます。尖ったサイトで楽しみながら実績確認ができるってなんかいいですよね〜。

さて、第9回はここで終了。次は10回目です!

この記事はここまで!
ここからはよく読まれる記事をまとめてご紹介します。ひとあじ違うデザインに出会えるかもしれません。

【実話】私、転職先の本当の実態を知って失敗したWebデザイナーです。

2019.01.14


良い構成のCVエリアのアイデアをいろいろと考察してみる

2017.12.24

【検証】本物のデザイナーだけが知っているCVエリアのボタンは何色がよいか?

2018.06.03


【たった1問】遷移型アンケートページの構成とデザインを調べてみる

2018.09.01

日本語フリーフォントお探しですか?未経験・新米Webデザイナーさんにおすすめなフォントを選んでみました!

2019.02.11

そのフォント使ってる?「NexusFont」で大量のフォントを管理してPCの負荷を抑えよう

2017.11.12

記事でもランディングページ(LP)でもないアンケートページの構成・デザインの作り方

2018.08.26


お気に入りの情報
が無かったでしょうか?
この記事の最後にデザイン情報やノウハウをレコメンド形式でご紹介しています。

お求めの記事に出会えますように。



スポンサード広告 by google