BOB and RUCYの暮らしノート

WEBデザイン、フロントエンド、暮らしのこと

センスは知識からはじまる|水野学|センスとは何かを知りたい人に。


センスは知識からはじまる [ 水野学 ]

センスとは何たるかが分かる本

デザイナーに限らず、企画や営業などあらゆる職種の人が一度は直面するのではないかと思う、センスに関する悩み。

例えば「いまいち」。「パッとしない」。「似合っていない」。そんな時に使われるであろう「センスがない」の言葉。

センスって何なのか?

なぜあの人にはセンスがあって私にはないのか?

センスとは先天的なものなのか?

モヤモヤした思いを抱き続けてきた私ですが、この本を読むとそんなモヤモヤをいくらか晴らすことが出来ました。

センスの正体を暴きたい人やセンスを身につけたい人にオススメしたい本です。

著者・水野学氏とは?

グッドデザインカンパニー代表。

肩書きはクリエイティブディレクター

様々なブランドづくり、商品企画、パッケージやインテリアデザイン、コンサルティングまで丸ごとディレクションしている人。有名なものでいうと、くまモンの生みの親だったり、中川政七商店ブランディングだったり。 世間から「センスが良い」と言われる代表のような人物です。

f:id:bobandrucy:20180912233949j:plain

f:id:bobandrucy:20180912234007p:plain

センスは鍛えることができる

本書では、センスは誰にでも備わった身体能力と同じで、日々の筋トレと同じように、センスは鍛えて伸ばすことが出来ると述べられています。

だから「私にはセンスがない」と悩む人はセンスがないのではなく、センスを磨くトレーニングが出来ていないだけですよというのです。

センスとは「数値化出来ない事象を最適化すること」である

センスとは、「数値化出来ない事象を最適化すること」であると水野氏は述べています。

ちょっと言葉が難しくてピンと来なかったのですが、私なりの解釈をすると、「最適化すること」=「ちょうど良いものを選ぶ、または作ること」と言えると思いました。

例えば、服を例に当てはめてみます。

  • 年齢にちょうど良い服を選ぶとセンスが良い。
  • TPOにちょうど良い服を選ぶとセンスが良い。
  • 来年流行る服を作るとセンスが良い。

(どんなに素敵な服でも50代女性には若々しすぎるティーンズ向けの服を着たらセンスが良いとは言えないし、10年後流行る服を作っても突飛すぎて世間に受け入れられないのでセンスが良いとは言えませんね。)

言葉や数値では言い表せないふわふわとしたものやことをちょうど良いところでピタリと選んだり作り上げたりすること。

センスとは「数値化出来ない事象を最適化すること」。無理矢理かつ勝手な解釈ですが、なんとなく腑に落ちました。

普通を知ることからはじまる

「数値化出来ない事象を最適化」するには、「普通を知ること」が必要だと筆者は述べています。

普通が分からなければ最適化する判断軸が存在しないからです。 そして普通を知るためには、幅広く「知識」を持たなければなりません。

知識の重要性・・・美術の話

センスに知識がいかに重要であるかを、美術の授業の話を持ち出して述べられていました。

私は本書の中でこの話が一番印象的でした。

学校の美術の授業では、作品制作を行う「実技」の時間に多くが割かれていて、美術についての知識を習得する「学科」の時間が少なすぎるというのです。

色相環(色の選び方)、画家の手法(テクニック)、美術の歴史など・・・知識を習得し、その知識をもって作品を制作するのがが本来美術のあるべき姿と述べています。

なるほど、と思いました。 確かに美術の授業を思い返してみれば、「今日は油絵をやります。はい、ではスタート!」といった具合で、美術の知識を座学で教えてもらう時間はなかったです。

美術の知識が欠落すると美的センス、美意識にコンプレックスを持つようになり、服や住まいやインテリア、持ち物や雑貨を選ぶことに自信が持てなくなります。身の回りの些細なことですが、これによって、「センス」という言葉への恐怖心が育っていってしまいます。 こうなると何かをゼロから作り出すという時、まず「自信がない」という状態になります。

知識がないとクリエイティブは出来ないということ。しかし逆に言えば知識を身につければ誰でもクリエイティブ力(センス)を伸ばすことが出来るのです。

知識習得からアウトプットまでの基本のステップ

ではセンスを伸ばすために知識を身につけよう、と言っても世の中には海のようにとんでもない量の情報に溢れていて、それを全て吸収しようと思うと溺れてしまうでしょう。

筆者は効率よく知識を身につけて、アウトプットするまでの基本のステップを紹介しています。このステップに当てはめると”ある程度”のレベルのものは作れるのだとか。ぜひ実践してみたいです。

  1. 王道(定番のもの、ロングセラー、ベストセラー)を知る
  2. 流行(最近のもの、話題のもの)を知る
  3. 1と2の共通項ルールを知る
  4. 3から仮説を導き出す。
  5. 仮説を検証し、結論に結びつける。これがアウトプット。

精度の高いアウトプットの実例

本書の後半では、実際に水野氏が関わったブランディングコンサルティングの事例を交えながら、アウトプットに至るまでの過程をいくつか紹介してくれています。こちらで詳細を書くことはしませんが、大変興味深い内容でした。

そもそも水野氏が関わっているものは以前から素敵だなと思っていたものたちばかり。それらが生み出された思考の過程を知ることが出来て面白かったです。

水野学氏が関わったもの、ことを一部紹介

THE

コンセプトから大好きなお店です。本書でも述べていましたが、水野氏が追求する「普通」や「定番」のこだわりを感じられます。 the-web.co.jp

フランダースリネン

FLANDERS LINEN

中川政七商店

www.yu-nakagawa.co.jp


センスは知識からはじまる [ 水野学 ]

プログラミング質問サイト・teratail(テラテイル)はコーディング関連でつまづいた時の駆け込み寺。

もうお手上げ状態!!!を救ってくれるteratail(テラテイル)

html, css, javaScript が想定通りの動きをしてくれない。理由も分からないし、もうお手上げ状態!

コーディング初心者だったらあるあるだと思います。

そんな時私がものすごく頼りにしていたのは、こちら。

teratail.com

プログラミング専用yahoo!知恵袋

どういうサービスかというと、一言で言えば、「プログラミング専用yahoo!知恵袋です。

  • 困っていることを書いて質問すると、玄人エンジニアが解決策を教えてくれる。

  • 質問者は一番ためになる解決策を提示してくれた人を、ベストアンサーに選ぶ。

といったもの。

taratail(テラテイル)を使うにあたって

回答者が丁寧に向き合ってくれる

このサービスを使ってみて一番驚いたのは回答者がとても丁寧に向き合ってくれること。

コメント機能を使って、細やかにやりとりをしてくれたのがとても印象的でした。

こっちはどうしたらいいか分からず、途方に暮れた状態で質問しているので、真摯に向き合ってくださる回答者の姿勢には涙が出るほど有り難いんです。

回答のソースを書いてうまく動作したときの感動はひとしおです。どうしてうまくいったのか理解出来ない時は、コメント機能でさらに質問すると優しく解説していただけたことも。

もっともっと頑張らないと!と勉強意欲も高まりました。

答えてもらいやすい質問をする

teratailは回答率の高さを売りにしています。(私が覗いている限り80%後半〜90%前半を推移している感じでしょうか。)

f:id:bobandrucy:20180906080016p:plain

とは言っても、もちろん「何を言ってるんだこいつ?」というような質問はスルーされる確率も高まります。

  • 何がしたいのか(成果)
  • どこで困っているのか(解決したいこと)
  • 実際のソース、エラーメッセージ
  • 試したこと

これらを簡潔に分かりやすく書くことが大事です。 特に実際に書いているソースやエラーが分かるエラーメッセージを載せないと回答されにくい(スルーされやすい)ように感じます。できるだけ書くようにしてください。

他の人の質問を閲覧できる

teratailでは他の人が質問した内容を検索し、閲覧することが出来ます。質問する前に過去に同じような質問がされているかチェックしましょう。

また、teratailにはタグ機能があるので言語や分野ごとに絞って検索することも可能です。

過去の解決済み質問を読むだけでも勉強になります。

上手な質問の仕方も学ぶことが出来ますね。

うまく使えば自己学習の効率アップ

teratail、私も本当にお世話になりました。

質問することで事象を整理することがことができるし、回答をもらうことで何となくで済まさず、しっかり理解することが出来るんですよね。

もちろんまずは自分で調べることが大事。初心者がつまづくたいていのことはググれば解決するからです。どうしても、という時の最後の頼み綱として利用することで自己学習の効率アップに繋がります。

teratail.com

ユニクロ エアリズムウルトラシームレスショーツがもう手放せない

f:id:bobandrucy:20180903115039j:plain

ユニクロの品質にはいつも驚かされます。

安いから1シーズン保てばいいと思って買っても、結局2〜3年十分に使えたり。値段の割に品質が良すぎるんですよね。しかも品質の良さは年々向上しているように思います。

そんなユニクロの中でも神がかって素晴らしい商品と出会えました。エアリズムウルトラシームレスショーツです!

こんなにも履いていて気持ちの良いショーツははじめてで、もう私の余生このショーツだけでいいと思えるほど手放せなくなりました。カラーも豊富なので、今日は何色にしようかな〜?と選ぶのも楽しかったりします。

エアリズムウルトラシームレスショーツ

www.uniqlo.com

2018年3月「24時間365日快適を維持する次世代のスマートインナー」をコンセプトにしたエアリズムの春夏コレクションで発売されました 。

極細繊維で肌触りがよく、汗をかいてもさらっと乾くことで人気のエアリズムにインナーラインの響かないシームレス下着ラインが発売されたのです。素晴らしい。

エアリズムとは?

1年365日、肌はじつに様々な不快にさらされています。汗でベタつく。寒暖差でムレる。重ね着で ゴワつく。擦れてチクチクする。だからこそ、エアリズムはさまざまな衣服内環境に対応して、自ら快適を調整し維持しています。まるで呼吸するように湿気や熱気を放出*6し、肌をさらさらに。すべるような肌ざわりで着心地をなめらかに。究極の心地よさをお届けするユニクロのLifeWear、それがエアリズムです。

シームレスとは?

アウターにひびかない。

縫い目がなくフラットなのでインナーのラインが目立たない

お値段は?サイズは?

税別590円。サイズは XS、S、M、L、XL、XXLの6展開です。

デザインは?

ビキニタイプ

www.uniqlo.com

ヒップハンガータイプ

www.uniqlo.com

ジャストウェストタイプ

www.uniqlo.com

履き心地は?

肌に吸い付くような感触です。ゴワゴワ感は0。冒頭でも述べましたが、こんなに履いていて気持ちの良いショーツははじめてです。

インナーラインも目立ちません。

もちろんエアリズム素材なのでジムやランニングにも最適なのだとか。

耐久性は?

購入時思ったのは「ちっちゃい毛玉いっぱいできそう」でした。しかし予想に反して、3ヶ月ほど使っていますが今のところ全く毛玉は出来ていません。

生地もヘタってきている様子もなく、購入時と変わらずつるつるさらさら。ストレッチ力もそのままです。旭化成と共同開発して作られた生地の素晴らしさを実感。

今後気になる商品

エアリズムウルトラシームレスショーツ、これからも買い足して使い続けると思います。そうなるとブラも揃えたくなります。今使っているものを買い換えるタイミングで試してみようかなと目論んでいるのはこちら。

www.uniqlo.com

・・・めちゃくちゃ楽そう。

ブラもショーツも見た目の可愛さより機能性の時代ですよ!!!(と、言い聞かせる)

超初心者向け、Photoshopを無料で勉強できるおすすめWEBサイト2選

使いこなせないフォトショ、いちから勉強したい

Photoshopいまいち使いこなせていない人って結構多いのではないでしょうか。

私もその一人で、趣味でなんとなーくいじりはじめたまま、だらだらと時間が経過し、”使いこなせていない”感覚をずっと持ったままでいました。なのでいざ仕事でPhotoshopを使用することになったとき、基本的なところから勉強し直す必要がありました。

本も良いけど・・・

もちろんPhotoshop入門関連の本もたくさん出ているのでそれらを読むというのも手ですが、私は実際に手を動かしながら覚えたかったのでPhotoshopを体系的に学べるWEBサイトで勉強しました。

無料Photoshop学習WEBサイト2選

ご紹介するWEBサイトはどちらも無料ですが、無料なのが信じられないくらい本当に良質で分かりやすいので、プロアマ問わず本当に皆さんにおすすめしたいです。私はこの両サイトを毎日交互に見るようにしていました。(飽きないように。)

サルワカ

saruwakakun.com

f:id:bobandrucy:20180903054248p:plain

「step1 フォトショップの基本」では、PhotoShopを使うにあたり知っておくべき基本的知識(レイヤーとは?とかブラシとは?とか。)が、”サルでも分かる”くらい分かりやすく図解で説明してくれています。この辺りを理解していないままPhotoShopを触るのと理解してから触るのでは上達スピードがぐんと違うのだろうなと思います。

脱線しますが、サルワカさんの記事はどれも図がたくさん入っていて分かりやすいし、美しいので見ていてストレスがまっっったくないんですよね。内容は初心者向きのものが多いのでWEBの勉強を始めたころはよく見ていました。

saruwakakun.com

UX MILK

uxmilk.jp

f:id:bobandrucy:20180903054255p:plain

Photoshopに関する記事をまとめてくれています。記事数が多いので参考になるのがきっとあるはずです。「各ツールの使い方」ではツールバーに並ぶ各ツールの使い方をひとつずつ説明してくれています。こちらは気になった記事ははてブでストックしておけるのも良いところ。

UX MILKはスマホアプリもあるのでスマホからも閲覧可能です。Photoshopの他にもUX・UI、デザイン、プログラミングなどの分野のクリエイターなら知っておきたい上質なトレンド記事ばかり。更新頻度は高くないけどチェックしておきたいWEBサイトです。

最後に

どうでしょうか。この2つを見ておけばある程度の知識はカバー出来るんじゃないかなと思います。あとはやりたいエフェクトのチュートリアルを探して、みようみまねでチェレンしていけば良いです。

はてなブログ「DUDE」をカスタマイズした① 行頭の位置変更

いろんなブロガーさんのブログを覗いでいると皆さん思い思いのカスタマイズを楽しんでいますよね。

見ていると私もカスタマイズしたい欲がむくむくと湧いてきて、今回実施に至りました。まだまだ発展途上ではありますが一旦まとめておこうと思います。

気取ったお洒落なデザインテーマ「DUDE」

はてなブログのテーマストアにて、無料でインストールできる、「DUDE」DUDE - テーマ ストア。これを元にカスタマイズしました。

”気取ったお洒落”がコンセプトだそうです。シンプルだけど都会的で、カラーも洒落っ気があって、素敵だなと思い選びました。

カスタマイズはhtmlとcssを学べる

はてなブログのカスタマイズは、テーマ作成者が書いたhtmlとcssを適宜、書き換える(上書きする)ことで行います。だから、いちからhtmlとcssを書く必要はなく、変更したいところだけいじれば良いので簡単です。

htmlやcss、つまりマークアップ言語を理解したい人・勉強している人にとっては格好の学び場になると思いました。

行頭の位置を変更する

さて、私はブログの内容を分かりやすく伝えるには、記事構成を分かりやすくすることが大事と思っています。

ということで一番最初にやりたかったのは中見出しと小見出しと本文で行頭の位置をそれぞれ変更することでした。

完成イメージ

f:id:bobandrucy:20180829225924j:plain

(大見出しは複雑な記事構成になりかえって分かりづらくなる理由から私は使用していないのでここでは省きますが、)大見出しの行頭位置も変更可能な内容となっているので、参考にしてみてください。

小見出しの行頭を15pxずらす
.entry-content h5 {
  margin-left: 15px;
 }

小見出しはh5タグ要素です。.entry-contentは記事の中の要素に付いているクラス名です。

entry-contentクラスのh5タグについて、左外側に15px余白をつけるという意味です。

本文の行頭を30pxずらす
.entry-content p,
.entry-content pre,
.entry-content ul, 
.entry-content ol {
  margin-left: 30px;
 }

.entry-content ul p,
.entry-content ol p {
 margin-left: 0px;
}

本文はpタグ要素、箇条書きはulタグ要素、番号付きリストはolタグ要素です。

前半{}は、記事の中の要素であることを表すentry-contentクラスのpタグ、ulタグ、olタグについて、左外側に30px余白をつけるという意味です。

後半{}はulタグとolタグの中に入っているpタグ要素には余白をつけないという意味です。これを記述しないと、前半{}1行目の「.entry-content p」に引っ張られて余白がついてしまいます。

完了

行頭位置はmarginをつかって色々と調整できるということが分かりました。

記事の構成が伝わりやすくなったんじゃないかなと思うし、全体にまとまりが出たようにも思います。

.entry-content h3 {
  margin-left: ●px;
 }

ちなみに、大見出しはh3タグなのでこのように書けば調整できます。

少し難しい話ですが、気をつけたいのは、entry-contentクラスの要素だけを指定するという意味の「.entry-content」を省略しないことです。省略するとサイドバー等の文字にもcssが適用され、レイアウトが崩れてしまうので注意してください。

未経験WEBデザイナー・エンジニア志望の就活、求人サイトとエージェントの使い方

求人サイトとエージェントを併用する

未経験でWEBデザイナーやエンジニア志望の人が就職活動する際、求人サイトとエージェントを併用することをおすすめします!求人サイトとエージェント、ふたつをうまく使うと就職活動が進めやすかったので、その利用方法をまとめたいと思います。

求人サイトとエージェントの違い

(知っている人も多いと思いますが)求職サイトとエージェントの違いを簡単に説明します。

エージェント

登録するとキャリアアドバイザーがついて、カウンセリングをしたのち自分に合った求人を紹介してもらえるサービスです。

面接時も一般公開していない企業情報を教えてくれたり、給与など条件交渉にも力になってくれたりとアドバイザーによる手厚いサポートを受けることが出来ます。

しかしエージェントは求職者を企業に内定させることで企業からお金をもらうシステムですので、求職者が受けたくない企業の面接を受けるよう勧められたりエージェント側に都合の良い求人しか紹介してくれなかったりということもあるようです。

求人サイト

様々な企業の求人情報が掲載されており、自分で興味のある求人を探して応募できるサービスです。職歴やスキルなどを登録しておけば、企業からスカウトが来ることもあります。

企業側が支払う掲載料が安いこともあり求人数はエージェントよりも多く、幅広い求人を探すことが出来ます。エージェントではなく自ら探して応募するので、面接時企業側に熱意が伝わりやすいというメリットも。

ただし面接対策や企業勉強は全て自分でやらなくてはいけません。また、実はエージェントしか持っていない非公開求人というものも存在するのがエージェントとの併用をお勧めする理由。

求人サイトで出来ること

どんな働き方があるのか知る

正社員、アルバイト、契約社員などがあります。未経験であればそれぞれどれくらいの求人があるのか掴みましょう。(未経験で正社員求人って意外と少なく、アルバイトや契約社員からスタートという形が多かったりします!)またそれぞれのお給料の相場も掴んでおきましょう。

どんな会社があるのか知る

例えばWEBデザイナーと言っても、自社WEBサービスのサイトをデザインする仕事もあれば、WEB制作会社でお客さんのWEBサイトをデザインする仕事もあります。どのような会社があるのかを知り、自分が行きたい会社はどんなところなのか方向性を考えます

また気になる会社は掲載情報だけではなく、企業サイトや口コミサイトもチェックしましょう。WEBデザイナー職の求人を出していても企業サイトを見るとSEO事業が売り上げ9割の会社だったりすることがあるからです・・・

エージェントで出来ること

希望する条件の求人を探してもらう

アドバイザーに希望する条件を具体的に伝えましょう。アドバイザーの立場になって考えると分かると思いますが、具体的な条件を言ってもらった方が探しやすいですよね。

求人サイトで、だいたい自分のレベル感的にどのくらいの条件を言えば企業がヒットするのか探っておきましょう。とは言っても、未経験であれば正直多くを選べる立場にはないのでどうしても譲れない条件だけを伝えるつもりでいると良いと思います。

条件例
  • 希望年収?

  • 勤務地?(自宅から電車で約●分以内など)

  • 勤務形態?

  • 他、企業サイトがおしゃれなところが良い、社員数が多いところが良い、週休二日制が良いなど。

履歴書、職務経歴書を添削してもらう

多くのエージェントでは、履歴書や職務経歴書の書き方を教えてくれたり、添削してくれたりします。ぜひ活用して書類選考通過しやすい書類を作成しましょう。

失業保険を申請中、かつ、給付制限一ヶ月目の人はエージェントを使うこと

前職を自己都合で退職し、失業保険を申請中で、かつ、給付制限期間一ヶ月目の場合応募はエージェント経由で行いましょう。エージェント経由で応募した企業で就職した場合、就職お祝い金的な位置付けで再就職手当というものが支給されます。

求人サイトから応募した企業で就職すると再就職手当は支給されないのです。(一ヶ月を過ぎれば求人サイト経由でも支給されます)

関連記事

再就職手当についてはこちらの記事に書きました。 bobandrucy.hatenablog.com

というただの個人的意見

当記事で私が述べたいのは求人サイトやエージェント(他にもMIIDASとかWantedlyとか。)色々な就職・転職に関するサービスが蔓延っていて選ぶのが面倒になるかもしれませんが、ひとつに限定せず、併用すると良いよということです。 個人の経験に基づく100%個人的意見ですので全てを鵜呑みにしなくて大丈夫なのですが、参考程度に片耳をちらっと傾けてもらえれば幸いです。

自己都合退職してもハローワークへ② 再就職手当とは?

f:id:bobandrucy:20180826120402j:plain

自己都合退職なら知っておきたい、再就職手当とは?

再就職手当とは、失業保険の支給残日数を残している状態で就職したとき、受け取ることができる一時金のことです。

失業保険は、就職が決まれば受給が終わっていなくても打ち切りとなってしまいます。しかし、条件を満たしていれば一時金として再就職手当をもらうことが出来るのです。

自己都合退職は失業保険の受給までに3ヶ月の給付制限期間があるので、失業保険をもらい終わるまでに就職が決まることは大いにあり得るでしょう。自己都合退職なら知っておいて損はない再就職手当についてまとめます。

支給残日数に注意を。支給額計算方法

支給額の計算

基本手当日額×給付残日数×60%もしくは70%

残日数を3分の1以上残して就職したときは60%、3分の2以上残して就職した場合は70% に、基本手当日額を掛けた金額となります。

本来失業保険で受給する予定だった金額の6割もしくは7割分もらえるということです。早期に就職を決めた方が多く受け取れる制度になっています。

自動計算してくれるサイトがあるので確認してみてください。

taisyoku-shitara.com

基本手当日額と支給日数を知りたい場合はこちらでどうぞ。

koyou.tsukau.jp

再就職手当の支給条件は?

再就職手当の支給にはいくつか条件があるので事前に確認しておく必要があります。

  1. 就職先は1年を超えて勤務することが確実であること。
  2. 待機満了後の就職であること。
  3. 給付制限開始一ヶ月間については、ハローワークまたは許可・届け出のある職業紹介事業者などの紹介により就職したものであること。
  4. 失業保険申請前に内定していないこと。

1については、契約社員でも更新して1年以上働くことができるのであればOKです。

2については、失業保険申請から7日間の待機期間に就職することは認められないということです。

3については、自己都合退職の場合のみのルールです。給付制限期間の一ヶ月間は以下の場合のみ支給条件となります。

  • ハローワークが「紹介状」を出して面接をして就職した場合(ハローワークの公開求人や情報誌を見て自身で応募し就職した場合は支給条件として満たさない
  • 職業紹介事業者の紹介で就職、つまり転職エージェントから仲介を受けて自身が直接雇用契約を結んだ場合(求人サイトや派遣会社経由で就職した場合は支給条件として満たさない

利用する職業紹介事業者が国の許可・届け出をしているかどうかは事前に確認しておくと良いでしょう。

再就職が決まったら?

再就職先が決まったら、就職の届け出と、再就職手当の条件を満たす場合は申請を行います。

就職の届け出は原則として勤務開始の前日ハローワークへ来所して行います。再就職手当の申請は原則として就職日の翌日から1ヶ月以内ハローワークに申請します。

特に、就職の届け出をしておかないと再就職手当をもらうことが出来ないのでお忘れなく。

関連記事

bobandrucy.hatenablog.com