疑念は探究の動機であり、探究の唯一の目的は信念の確定である。

数学・論理学・哲学・語学のことを書きたいと思います。どんなことでも何かコメントいただけるとうれしいです。特に、勉学のことで間違いなどあったらご指摘いただけると幸いです。 よろしくお願いします。くりぃむのラジオを聴くこととパワポケ2と日向坂46が人生の唯一の楽しみです。

Vuetifyによる3カラムレイアウトの書き方

概要
Vuetifyによる3カラムレイアウトのコードを記述する。


3カラムレイアウトのイメージ図


実際の完成ページ
1. 画面が大きい(lg)かつサイドバーを開いた場合


2. 画面が大きい(lg)かつサイドバーを閉じた場合


3. 画面が小さい(sm)場合


ソースコード

  • 今回はNuxtで実装した。
  • 次のコードはPageフォルダ内のファイルである。Layoutsはデフォルト。
<template>
  <div class="mt-n3">
    <v-row no-gutters>
      <!-- Left Side -->
      <v-col
        cols="12"
        sm="2"
        lg="2"
      >
      <div class="pt-16">
      <!-- Left Side 1 -->
      <v-card-title class="font-weight-bold text-subtitle-1">
        Left Side 1
      </v-card-title>
      <!-- Left Side 2 -->
      <v-card-title class="font-weight-bold text-subtitle-1">
        Left Side 2
      </v-card-title>
      <!-- Left Side 3 -->
      <v-card-title class="font-weight-bold text-subtitle-1">
        Left Side 3
      </v-card-title>
      </div>
      </v-col>

      <!-- Center Side -->
      <v-col
        cols="12"
        sm="8"
        lg="8"
        
      >
      <v-card
        class="pt-6 pl-2 pr-2"
        outlined
        tile
      >
      <v-row class="mb-6" align-content="center">
        <v-col>
          <h1 class="text-center">Center Side</h1>
        </v-col>
      </v-row>
      <v-row no-gutters class="mb-10">
        <v-col cols="3">
          Partition 1
        </v-col>
        <v-col cols="3">
          Partition 2
        </v-col>
        <v-col cols="3">
          Partition 3
        </v-col>
        <v-col cols="3">
          Partition 4
        </v-col>
      </v-row>
      <v-row no-gutters class="mb-10">
        <v-col cols="4">
          Center Side 1
        </v-col>
        <v-col cols="4">
          Center Side 2
        </v-col>
        <v-col cols="4">
          Center Side 3
        </v-col>
      </v-row>
      <v-row class="mb-6" align-content="center">
          <v-col cols="6">
            Partition Center 1
            <v-text-field
              outlined
              tile
            ></v-text-field>
          </v-col>
          <v-col cols="6">
            Partition Center 2
            <v-text-field
              outlined
              tile
            ></v-text-field>
          </v-col>
      </v-row>      
      <v-row class="mb-6" align-content="center">
          <v-col cols="12">
            Partition
            <v-text-field
              outlined
              tile
            ></v-text-field>
          </v-col>
      </v-row>      
      </v-card>
      </v-col>

      <!-- Right Side -->
      <v-col
        cols="12"
        sm="2"
        lg="2"
      >
      <div class="pt-16 pl-2 pr-2">
      <v-card-title class=" text-subtitle-1" style="border-bottom: solid 1px; padding-bottom: 1px;">
        HAGE
      </v-card-title>
      <v-card-title class="mb-7 text-subtitle-1" style="border-bottom: solid 1px; padding-bottom: 1px;">
        BOKE
      </v-card-title>
      </div>
      </v-col>
    </v-row>
  </div>
</template>

問題点

  • 上記のコードを次のように修正して、バックグラウンドの色を変更してみます。
before:
<v-row no-gutters>

after:
<v-row no-gutters class="grey lighten-4 black--text">
before:
      <!-- Center Side -->
      <v-col
        cols="12"
        sm="8"
        lg="8"
        
      >
      <v-card
        class="pt-6 pl-2 pr-2"
        outlined
        tile
      >

after:
      <!-- Center Side -->
      <v-col
        cols="12"
        sm="8"
        lg="8"
        
      >
      <v-card
        class="pt-6 pl-2 pr-2 blue"
        outlined
        tile
      >


すると次のようになります。

1. 画面が大きい(lg)かつサイドバーを開いた場合


2. 画面が大きい(lg)かつサイドバーを閉じた場合


3. 画面が小さい(sm)場合

この3カラムレイアウトのコードには次のような問題点があります。

  1. サイドの2つのカラムは同じ色になってしまう。
  2. 中央のv-cardが中途半端になってしまう。ヘッダまでピッタリとカードをつけたいが、それを自動的に調節してくっつける方法がわからない。
  3. サイドバーが開いていない場合、サイドの2つのカラムは両端まで広がっていない。

解決方法

上記の問題点は一部、修正することができます。以下、アドホック的な解決策です。

サイドの2つのカラムは同じ色になってしまう。

次のようにバックグラウンドを修正すれば、サイドのカラムの色も自由に変更することができます。

before:
<template>
  <div class="mt-n3">
    <v-row no-gutters>
      <!-- Left Side -->
(中略)
      <!-- Right Side -->
      <v-col
        cols="12"
        sm="2"
        lg="2"
      >


after:
<template>
  <div class="mt-n3">
    <v-row no-gutters class="grey lighten-4 black--text">
      <!-- Left Side -->
(中略)
      <!-- Right Side -->
      <v-col
        cols="12"
        sm="2"
        lg="2"
        class="yellow"
      >

修正結果

中央のv-cardが中途半端になってしまう。

v-cardのプロパティにheightmax-heightなどがありますので、それを利用すればカードの境界線とヘッダの境界線が近づけることはできます(ピッタリにはどうやらできません)。次のように修正すれば一応、部分的に解決できます。

before:
      <v-card
        class="pt-6 pl-2 pr-2"
        outlined
        tile
      >

after:
      <v-card
        class="pt-6 pl-2 pr-2 blue"
        outlined
        tile
        height="600"
      >

修正結果

しかしこの解決策をおこなっても、次のような問題点があります。

  1. 隙間は完全には埋まらない。原因はいまのところわかりません。どこかを修正すれば可能かもしれません。
  2. heightの値はコードの量に応じて、毎回変更しなければならない(絶対値を設定しなければならない)。ヘッダまでピッタリとカードをつけるために、自動的にくっつけるような方法はわかりません。そもそもできるのかもわかりません。

サイドバーが開いていない場合、サイドの2つのカラムは両端まで広がっていない。

残念ながらわかりませんでした。

終わりに: 補足

上記のコードにおいて左側のカラムと右側のカラムにはv-cardがないにもかかわらずv-card-titleが使用されています。あまりいい使い方ではないかもしれませんので、別のタグに変更した方がいいかもしれません。

書評: エイミー・C・エドモンドソン著『恐れのない組織――「心理的安全性」が学習・イノベーション・成長をもたらす』

一言書評
心理的安全性という概念の提唱者自身による心理的安全性についての概説書。

Kindle版を読了(そのため引用はページ数ではなく章・節単位で表示する)。

要約

本書は心理的安全性の提唱者自身による心理的安全性についての概説書である。この本で心理的安全性について一通り学ぶことはできるが、どのようにしてチームに心理的安全性を高めるかという方法論は具体的でなくあまり役に立たない。
本書は三部構成となっている。第一部は第1章と第2章であり、心理的安全性についてのまとめである。第二部は第3章〜第6章までであり、心理的安全性のケーススタディがある。第三部は第7章と第8章であり、どのように心理的安全性を向上させるのかが示されている。第二部は不要とまでは言わないが冗長であり、第一部と第三部を読めば十分である。

心理的安全性が注目されるきっかけ

心理的安全性という概念を提唱したのは1999年であり、これまで20年以上研究が進んできた。ビジネスにおいてこの言葉が注目されたきっかけは、2016年2月の『ニューヨーク・タイムズ・マガジン』の記事である。そこには「最高のチームをつくる要因は何か」を突きとめるためのグーグルでの五年にわたるプロジェクト(プロジェクト・アリストテレス)を発表し、最高のチームをつくる第一要因は心理的安全性であると結論づけられた。その後、プロジェクト・アリストテレスの特集が『ニューヨーク・タイムズ』やCNNの番組『ファリード・ザカリアGPS』で報道されると、一気に注目を集めるようになった。

心理的安全性とは何か

心理的安全性とはチームの状態であり、皆が率直に意見や懸念や疑問を表明できるような空気のことである。心理的安全性が高ければ、皆が率直に言える雰囲気であり、逆に心理的安全性が低ければ、皆が意見を言えない雰囲気である。本書では心理的安全性を次のように述べている。

心理的安全性とは、大まかに言えば「みんなが気兼ねなく意見を述べることができ、自分らしくいられる文化」のことだ。より具体的に言うなら、職場に心理的安全性があれば皆、恥ずかしい思いをするんじゃないか、仕返しされるんじゃないかといった不安なしに、懸念や間違いを話すことができる。考えを率直に述べても、恥をかくことも無視されることも非難されることもないと確信している。わからないことがあれば質問できると承知しているし、たいてい同僚を信頼し尊敬している。


ch. はじめに
sec: 複雑で不確実な世界で成功するために必要なもの

心理的安全性とは、支援を求めたりミスを認めたりして対人関係のリスクを取っても、公式、非公式を問わず制裁を受けるような結果にならないと信じられることだ。心理的に安全な環境では、失敗しても支援を求めても、ほかの人たちが冷たい反応を示すことはない。それどころか、率直であることが許されているし期待されてもいるのだ。心理的安全性は、人々が次のように感じるときに存在する。この職場では、率直に意見を言ったりアイデアを提供したり質問したりしても、懲らしめを受けるんじゃないか、ばつの悪い思いをするんじゃないかと不安になったりしない、と。あなたの職場は、新しいアイデアが歓迎され、当てにされているだろうか。それとも、こき下ろされ、冷笑されるだろうか。同僚と違う考え方を持ったら、ばつの悪い思いをさせられたり制裁を受けたりするだろうか。わからないことがあると認めたら、馬鹿にされるだろうか。


ch. 1: 土台
sec: 不安によって意欲をうまく引き出せない理由

考えや懸念や疑問を気兼ねなく話すことは、多くのマネジャーが気づいているよりはるかに頻繁に、決まって対人関係の不安によって邪魔をされる。この手の不安は、はっきりとは見えない。沈黙しようと思う人が──声を出せたとして──、これから沈黙しますと宣言することはまずない。やがて時間が過ぎて結局、意見を言わずにいた者がいちばん賢かったことになる。  対人関係のリスクを取っても安全だと信じられる職場環境であること。それが心理的安全性だと、私は考えている。意義ある考えや疑問や懸念に関して率直に話しても大丈夫だと思える経験と言ってもいい。心理的安全性は、職場の仲間が互いに信頼・尊敬し合い、率直に話ができると(義務からだとしても)思える場合に存在するのである。

ch. 1: 土台
sec: 心理的に安全な職場を構想する

心理的安全性とは何でないか

1. 心理的安全性は、感じよく振る舞うこと(being nice)ではない。また礼儀正しさ(polite)とも関係がない。むしろ相手と対立することはしばしば起こる。

2. 心理的安全性は、性格の問題ではない。「会議中に発言できないのはその人が内向的だからとか、逆に会議中に発言できるのはその人が外向的だから」ということではない。内向的・外向的は関係がない。性格の如何に関わらず、心理的安全性が低ければ自ら発言を避ける傾向となり、逆に心理的安全性が高ければ積極的に発言するようになる。

3. 心理的安全性は、信頼の別名ではない。心理的安全性はチームの特徴であり、信頼は個人間の関係性である。例えば次のような状況を考えてみよう。そのチームは心理的安全性が低いため、普段の会議では自分の思ったことを発言できない。しかし、ひとたび会議が終わって喫煙所に向かうと同じ会議に出席した仲のいい同僚がいて、その人に「ここだけの話、あの意見は賛成できないな」と本音を言う。このような状況はありえるだろう。これは心理的安全性がチーム全体の特徴であるのにたいして、信頼は個々人の関係性であることを示している。

4. 心理的安全性は、目標達成基準を下げることではない。心理的安全性を高めることは目標や成果を下げることではなく、むしろハイパフォーマンスを実現するための環境のことである。

心理的安全性の効果

心理的安全性が高い場合、どのような効果が得られるのか。研究の結果次のようなことがわかっている。
1. 従業員のエンゲージメントの上昇

2. イノベーションの上昇

3. パフォーマンスの上昇

4. 地理的分散の影響の減少


筆者自身、心理的安全性だけで十分であるとは思っていない。現代においては心理的安全性は成功するために必要なひとつの要因にすぎないと考えている。

心理的安全性さえあれば高パフォーマンスをあげられる、などと言うつもりはない。いささかも、ない。私が言いたいのは、心理的安全性があれば、可能であるはずのことが不可能になるのを減らせる、ということである。ただ、自動車を動かすのが燃料でないのと同様、組織を動かすのは心理的安全性ではないのだ。


ch. 1: 土台
sec: 心理的安全性だけでは十分ではない

むろん、心理的安全性があれば、競争が激化していく業界にあってもノキアは確実に成功できたなどと言えるわけではない。成功には、専門知識と創意工夫とチームワークに支えられた、たゆまぬイノベーションが欠かせないのだ。ただ、心理的安全性がなかったら、専門知識や創意工夫を十分に活かすことは難しい。


ch. 3 回避できる失敗
sec: 真実を恐れる

私は、心理的安全性が万能薬であるとは思っていない。そういうものでは全くなく、現代経済で成功するために必要な数多の要因の一つにすぎない。


ch. 8: 次に何が起きるのか
sec: 心理的安全性に関する、よくある質問
subsec: 心理的安全性が過度になることはないか


しかし、実際には心理的安全性は絶対不可欠と言っている。

会社でプロジェクト・チームを率いるにせよ、病棟で患者の治療をするにせよ、あるいは、ピッチでクリケット・チームを監督するにしろ、学校で子どもに教えたり助言したりするにしろ、はたまた不正行為について声をあげるよう皆を促すにせよ、火星(!)に行くにせよ、心理的安全性はさまざまなチームや組織でコミュニケーションを図り、協力し、試し、仲間の幸せを確実にするために、絶対に不可欠なのである。


ch. 2 研究の軌跡
sec: 特典などではない

心理的安全性の測定方法

心理的安全性は次のアンケートによって測定することができる。点数が高ければ高いほど、そのチームの心理的安全性は高く、点数が低ければ低いほど、そのチームの心理的安全性は低い。

1. このチームでミスしたら、決まって咎められる。
(7点: まったくそう思わない〜1点: 非常にそう思う)


2. このチームでは、メンバーが困難や難題を提起することができる。
(7点: 非常にそう思う〜1点: まったくそう思わない)


3. このチームの人々は、他と違っていることを認めない。
(7点: まったくそう思わない〜1点: 非常にそう思う)


4. このチームでは、安心してリスクを取ることができる。
(7点: 非常にそう思う〜1点: まったくそう思わない)


5. このチームのメンバーには支援を求めにくい。
(7点: まったくそう思わない〜1点: 非常にそう思う)


6. このチームには、私の努力を踏みにじるような行動を故意にする人は誰もいない。
(7点: 非常にそう思う〜1点: まったくそう思わない)


7. このチームのメンバーと仕事をするときには、私ならではのスキルと能力が高く評価され、活用されている。
(7点: 非常にそう思う〜1点: まったくそう思わない)


まったくそう思わない・そう思わない・あまりそう思わない・どちらとも言えない・ややそう思う・そう思う・非常にそう思う



ch. 1: 土台
sec: 心理的安全性を測定する

心理的安全性を上げる方法

本書では心理的安全性を向上させる方法を提示している。それによると次の3ステップがある。
1. 土台をつくる
 1. 仕事をフレーミングする
 2. 目的を際立たせる
2. 参加を求める
 1. 状況的謙虚さを示す
 2. 探究的な質問をする
 3. 仕組みとプロセスを確立する
3. 生産的に対応する
 1. 感謝を表す
 2. 失敗を恥ずかしいものではないとする
 3. 明らかな違反に制裁措置を取る

STEP 1: 土台をつくる STEP2: 参加を求める STEP3: 生産的に対応する
リーダーの務め 1. 仕事をフレーミングする(マインドセット)
- 失敗、不確実性、相互依存を当たり前とし、率直な発言の必要性を明確にする。
2. 目的を際立たせる
- 危機にさらされているものと、それがなぜ、誰にとって重要であるかを意識する
1. 状況的謙虚さを示す
- 完璧でないことを認める。
2. 探究的な質問をする。
- よい質問をする
- 集中して「聴く」手本を示す。
3. 仕組みとプロセスを確立する。
- 意見を募るためのフォーラムを設ける。
- ディスカッションのためのガイドラインを示す。
1. 感謝を表す
- 耳を傾ける。
- 受け容れ、感謝する。
2. 失敗を恥ずかしいものではないとする。
- 未来に目を向ける。
- 支援を申し出る。
- 次のステップについて話し合い、熟慮し、ブレーンストーミングする。
3. 明らかな違反に制裁措置を取る。
成果 期待と意味の共有 発言が歓迎されるという確信 絶え間ない学習への方向づけ


表 7.1 心理的安全性を確立するためのリーダーのツールキット

感想&批判

感想

1. 心理的安全性には二つの側面がある。ひとつは下の者が上の者に意見を率直に言えるかどうかということである。もうひとつは意見について上の者が丁寧に聴けるかどうかということである。要は「率直に発言する」ことと「耳を傾ける」ことである。

2. 立場に関わらず発言された意見・反論・異論・懸念・可能性について、すべてを検証したり、検討したりすることは不可能である。そしてほとんどの可能性は実際に起こらないし、さらに決定的なことは、当初想定されていなかったことがしばしば起こるということである。意思決定者はあらゆる可能性から初めからある程度無視しなければならない。さらにコストなどからその意見を検証しないことを判断することもある。何が検討されるべき意見なのかをどう判断するのか。その判断はほとんど不可能である。

3. 心理的安全性のキーワードは率直(candor)である。

4. いわゆる日本型経営というものは、これまで散々批判されてきたけれども、心理的安全性の観点から考えると、実はそんなに悪いものではないのかなと思った。例えば、終身雇用やいわゆる飲みニケーションなどの飲み会である。勝手な想像だが、昔の日本の会社では日中での会議は建前で話して、会社終わりに飲み会で本音を語ることで心理的安全性を高めていたのかもしれない(もしかしたら日本型経営はチームの心理的安全性を高めるというよりも個人間の信頼関係を高めることに効果を発揮していたのかもしれない)。しかし、たとえそのような方法で心理的安全性を高めていたとしても、そのやり方には疑問がつく。というのも、飲み会をおこなえばその分の時間を社員は犠牲にしなければならない(それは家族との時間や自分の時間などである)からである。それだったら日中から率直に話すべきだと思うし、そのための仕組みを作るべきだと思う。

5. 逆にこれまで手本のようにされていた外資系企業などに見られる成果主義実力主義(これも評者の完全な思い込み)も、心理的安全性の観点から考えると、よくないものなのかもしれない。というもの、そこでは失敗が認められていないからである。少なくとも社員は失敗を恐れてリスクを回避したいような傾向を持つようになる(業績が下がれば、年収が下がるから)。だが、現代においては失敗を回避するような行動で成功を収めることはできない。

不安によってマネジメントする方法について

これまで(現在も)上司はしばしば部下に不安や恐怖を与えることで、仕事をさせることがある。これまではそれでうまくいったけれども現代では時代遅れだと著者は言う。

組立ラインの仕事や畑仕事──反復作業を個人レベルで手早く正確にすることで評価される仕事──の従事者のやる気を高めるのに、かつては不安が効果的だったかもしれない。多くの人が、不安をあおって支配する上司にイヤな思いをさせられてきたし、それが当たり前にもなっている。いや実際、大衆文化はそういう上司を誇張し、コミカルに描いてきた。ピクサーのアニメ映画『レミーのおいしいレストラン』も、その一つだ。主人公であるネズミのレミーは、シェフになることを夢見ている。そんなレミーの前に、厨房を仕切る専制君主のようなレストランのシェフが立ちはだかるのである。  だがそれ以上に悪いのは、不安にはやる気を引き出す力があると、多くのマネジャーが──意識的にも無意識にも──相変わらず信じていることだ。(経営陣あるいは成績不振の結果を)恐れさせれば、人は望ましくない事態を避けるために熱心に仕事をするようになる、ひいては会社の業績も上がる、と信じ込んでいるのである。これは、仕事が単純で、作業者が問題にぶつかることも改善を提案することもまずない場合なら、有効かもしれない。だが、学習や協力をしなければ成功できない仕事なら、不安がやる気を引き出す要因になることはない。


ch 1. 土台
不安によって意欲をうまく引き出せない理由

→ いちおう神経科学の知識を持ってきて正当化しているが、根拠は薄弱だと思う。どうしてかつてはうまくいったのか、またはうまくいったと思われたのかちゃんと原因を調べなくてはならないと思う。

これは極端な例かもしれないが、実を言えば、特定の目標を従業員に達成させるために権力を使うことを、多くのマネジャーが支持している。すなわち、明確なメトリクス(指標・目標数値)とデッドラインを与えるのである。目標を達成できなかった場合のマイナスの影響をはっきり理解しなければ、従業員は努力を怠るかもしれない──そんな思い込みが広まり、職場でのモチベーションについて話したり書いたりする人々はもとより、多くのマネジメント担当者がその思い込みを当然と捉えている。気づいている人はあまりいないが、不安によるモチベーションアップは、目標を達成しつつあると錯覚(強調は著者)させるうえで絶大な効果を発揮する。だが、知識集約型の職場に創造力、適切なプロセス、必要な情熱を確実にもたらし、難しい目標を達成するうえでの効果はない。


ch. 3: 回避できる失敗
sec: 厳しい基準

二〇一五年のフォルクスワーゲンディーゼルゲート事件が誰か一人、あるいは数人の性格やリーダーシップに根本原因があって起きたなどということはない。ただ、労働者の意欲を刺激する方法について、時代遅れの考え方にしがみついたために失敗したとは言えるだろう。

(中略)

今日では、そのような方法はなおさら滑稽に思われる。現代は、単純作業がますます自動化され、ナレッジ・ワーカーはネジを締めるのではなく、協力し、さまざまなものを総合し、意思決定し、絶えず学習する、そういう時代だからである。


ch. 3: 回避できる失敗
sec: 厳しい基準

もしかしたら、フォルクスワーゲン排気ガス不正スキャンダルに関して何より驚くのは、この事件が全く特異ではないことかもしれない。達成不可能なターゲット・ゴール、不安によって意欲を高めようとする指揮統制型ヒエラルキー、ミスをしたらクビになるのではないかと不安に思う従業員──そういうシナリオが、何度も繰り返されてきたのだ。理由の一つは、このシナリオが過去には有用だったからである。昔は、目標が達成可能で、進歩をじかに観察でき、ほとんどの仕事が個人単位で行われていた。そのような条件下でなら、不安と脅しによって人々に目標を達成させるのが可能だったかもしれない。だが、今日のような不安定で(volatile)、不確実(uncertain)、複雑(complex)、かつ曖昧な(ambiguous) VUCA世界では、このシナリオがビジネスに役立つことは、もはやない。それは成功するためではなく、回避可能な、しばしば苦痛なほど注目される失敗を招くための戦術でしかないのだ。


ch. 3: 回避できる失敗
sec: 厳しい基準

→ 上と同様。根拠はほとんどない。


心理的安全性の前提である言語について

率直に意見を言い、相手の言いたいことに耳を傾けることが重要であると著者は言うが、そうなるとここで問題となるのが言語の問題である。ある言語(英語・日本語)による完全な理解力がチーム全員に不可欠となる。

同様に、メンバーが複数の地域に配置されているという特徴を持つチームなら、協調できるよう努力する必要があるかもしれない。研究によって、心理的安全性があれば、そのような難題にチームが対処しやすくなることが明らかになっている。考えをはっきり述べたり、質問したり、仕事をやり遂げるのに必要な支援を互いに得たりできるときのほうが、人々は分野の多様性や時差を越えて協力し、障壁を克服する可能性が高いのだ。


ch. 2 研究の軌跡
sec: 調査研究

世界各地に分散し、じかに顔を合わせたことがないかもしれないメンバーと仕事をする状況は、チームにとってますます当たり前になっている。このいわゆるバーチャル・チームが直面しているのが、そのようなチームならではの問題──電子メディアによるコミュニケーション、多様な国民文化に対する対応、時差への対処、時間の経過とともに起きるメンバーの入れ替わりへの対応といった問題だ。心理的安全性があれば、そうした難題にチームが対処しやすくなることが明らかになってきている。たとえば、ウェスタン・オーストラリア大学のクリスティーナ・ギブソン教授とラトガーズ大学のジェニファー・ギブス教授が、一八カ国に分散するメンバーから成る一四のイノベーション・チームを対象に実施した野心的な研究によると、心理的安全性があれば、各地に散らばるチームが地理的分散の問題に対処しやすくなることが突きとめられた。心理的安全性のおかげで、チームメンバーはほかの人にどう思われているかをあまり心配に思わず、率直にコミュニケーションを図りやすくなったのだった。


ch. 2 研究の軌跡
sec: 5 特別な構成要素としての心理的安全性
subsec: 地理的分散を克服する

→ ここで決定的に重要なのは言語の障壁である。質問できる環境があってもそれを伝える言葉が話せなければ、そして聞くことができないならば意味がない。

沈黙することは国籍に関係ない

沈黙することは悪い知らせだけでなく、よいアイディアのときですら起こる。
口を閉ざす理由は主に2つあり、悪印象を持たれる不安と仕事上の人間関係の悪化の不安である。

数年前、バージニア大学のジェームズ(ジム)・ディタート教授と私は、ある大手多国籍ハイテク企業で二三〇人を超える従業員にインタビューをした。そして、地域も職位も職務もさまざまな彼ら従業員に、自分より地位の高い人(マネジャーなど)に職場で率直に話した、あるいは話さなかった例を挙げてもらった。やはり全員が、重大だと思う問題なのに率直に話せなかったときのことを、すぐに思いつくことができた。


ch. 2 研究の軌跡
sec: 1 蔓延する沈黙

→ 著者が引用している文献では、被験者(インタビューに答えた人達)の国籍などに言及しているのかはわからないが、おそらく対象者はアメリカ人が中心なのだろう。なんでも自分の意見を言いそうなアメリカ人でさえも意見を言わないことがままあるというのは驚きである(それとも評者の単なる偏見?)。どうやら黙るのは国民性とかあまり関係ないのだろう。

「空気を読む」のは何も日本人だけではない。比較的早い時期から「自分は他人からどう思われているのか」ということに気づき、どのようにすれば自分が軽蔑されないかを学ぶのである。ーーその最も簡単な方法は「黙る」ことである。

別の言い方をすると、どんな人でも朝、目覚めて気が重いのは、勤め先で無知・無能に見えたり混乱をもたらす人だと思われたりする場合だ。そのように思われるのが対人関係のリスクと呼ばれるものであり、無意識かもしれないが、およそ誰もが避けたいと思っている。実際、大半の人は、頭がよく有能で役に立つ人間だと他人から思われたいと願っているのだ。職業、地位、ジェンダーにかかわらず誰もが、人生の比較的早い時期に、人間関係上のリスクをコントロールできるようになる。子どもは小学校のある時点で、他人にどう思われているかが重要であることに気づき、拒絶あるいは軽蔑されるリスクを下げる方法を身につける。大人になる頃にはたいてい、そうするのが本当にうまくなっているのだ。達人張りにうまくなってしまうため、それをするのにもはや意識的に考えることもない。無知だと思われたくない?  それなら質問するな。無能に見えたくない?  それならミスや弱点を認めるな。事態をややこしくする人間だと言われたくない?  それなら提案するな。意義ある行動より見た目の申し分なさを重視するのは、社交の集まりでは妥当かもしれないが、職場ではそうした傾向によって重大な問題が起こりかねない──イノベーションが阻害されたりサービスの質が低下したり、最悪の場合には人命が失われたりするかもしれないのだ。それなのに、他人に軽視される結果を招くかもしれない行動を避けることが、大半の職場でほとんど習慣になってしまっている。


ch1: 土台
sec: 無意識に計算する人たち

「沈黙は金」である。ただし、自分にとってのみ。

アメリカ人でも失敗は避けたい

学習プロセスにはミスや賢い失敗が欠かせないとするダリオの考え方は、成長の仕方やイノベーションの生まれ方について私たちが知っているものと一致している。ダリオは次のように考えている。「現代社会の失敗恐怖症は深刻だ」、なぜなら、正解を探すことを小学校時代の初めに教えられてしまい、革新的・自立的思考へつながる道として失敗から学ぶことを身につけないからだ、と。また、彼は早くから次のように述べている。「誰もがミスをするし欠点もあること、それらにどう対処するかで決定的な違いが生じることを学んだ」。だからブリッジウォーターでは、「失敗するのは構わないが、失敗に気づき、分析し、そこから学ばないのは容認されない」のである。


ch 5: フィアレスな職場
sec: 透明性ライブラリ

→ しばしば日本の教育について「正解を探すような教育をしている。そんなのだめだ!」と言われている。「アメリカのように自由で...」なども言われているかもしれない。少なくともたくさんのベンチャーがあるアメリカでは失敗について個人的にも社会的にも寛容なのかなと思っていた。しかしアメリカ人でも「正解を探すことを小学校時代の初めに教えられてしまい、革新的・自立的思考へつながる道として失敗から学ぶことを身につけない」らしい。そうなのか!

発言ができたとしても対応するかどうかは別問題

皆が意見や懸念を表明できるような環境ができたとしても、その見解をちゃんと対応するかは別問題である。せいぜい「ご指摘ありがとうございます。検討してみます」と返答されて終わりかもしれないし、コストなどを考慮して、その指摘を無視するかもしれない。もちろんその判断の責任は経営陣にあるのだが。

不安定性(volatility)、不確実性(uncertainty)、複雑さ(complexity)、曖昧さ(ambiguity)、すなわちVUCAに直面しているあらゆる企業にとって、心理的安全性は最終的な収益に直結している。なぜなら従業員の指摘、疑問、アイデア、懸念は、市場と組織で起きていることについて重要な情報をもたらすからである。


ch. 2 研究の軌跡
sec: 特典などではない

→ 「重要な情報」は得られるかもしれないが、ほとんどの指摘・疑問・アイディア・懸念は可能性に過ぎない。玉石混淆の情報からどのように「重要な情報」を得るのか。

この事故のような悲劇──若手が率直に発言していたら、回避できたかもしれない悲劇──の原因を分析する多くの人が、必ずと言っていいほど次のように指摘する。人々はもう少し気骨、すなわち勇気を持つべきだ、と。この主張には賛同しないわけにはいかない。ただ、賛同できても、効果的な主張かどうかはまた別問題だ。正しいことだからという理由で人々に率直な発言を促すことは、倫理観に訴えており、確実によい結果をもたらす戦略とは違う。勇気を出して行動すべきだと主張すれば、そうしてもらえるだけの状況をつくらないまま、人々に責任を負わせることになってしまうのだ。


ch. 4 危険な沈黙
sec: 口にされなかったこと

かくて沈黙の文化とは、率直な発言を妨げるだけでなく、率直に発言する人の言葉に、とりわけその人がもたらす知らせが不愉快なものである場合には、注意深く耳を傾けられなくなる文化なのである。
一九八六年に起きたスペースシャトル・チャレンジャー号の爆発事故を考えてみよう。ロドニー・ローシャが職場の重要な局面で沈黙したのとは違い、ロジャー・ボイジョリー( NASAの受託業者モートン・チオコール社のエンジニア)は、はっきりと意見を述べた。悲惨な結果となる打ち上げの前夜、ボイジョリーは懸念を提起する。シャトルの接合部に装着された Oリングの性能が、想定外の外気温低下によって失われるかもしれない、と。彼のデータは不完全で、論理も曖昧だった。だがもし、集まった人々が熱心かつ丁寧に耳を傾けていたら、簡単な分析と実験を行って曖昧さを解消できていただろう。つまり、発言が成果をあげるためには、耳を傾ける文化が不可欠なのである。「聴く」文化が軟弱な場合どんなことが起きうるか、近年の例を見ていこう。


ch. 4 危険な沈黙
sec: 沈黙の文化

→ 耳を傾けたとしてもだからと言って行動するかどうかは別問題である。何でもかんでも検証することはできない。「簡単な分析と実験を行って曖昧さを解消できていただろう」と本当に簡単に言えるのか? 結果論からどうとでも言える発言だと思う。

主張が不明瞭

ここでわかるのは、明確なヒエラルキー心理的安全性が、フィアレスな組織では相容れないものではないということである。ブリッジウォーターでは考えを頻繁かつ率直に言うのが当たり前になる必要があるが、一方で、率直に話すことがヒエラルキー──個人の実績を基盤の一部とするヒエラルキー──と共存している。ただし、コンセンサスによる意思決定は行われない。ピクサーのブレイントラスト同様、率直な討論の目的は、主要な意思決定者に別の視点をもたらして、最良の結果を見出しやすくすることなのだ。また、もし独断的で自信たっぷりな社員の意見をあらかじめ選んでおきがちな文化であるなら、傲慢さに対して注意が必要だとダリオは警告する。「意見を述べる資格を得ているかどうか、自問してみるといい」と彼は言う。そのような資格は、実績を積み、責任を果たすことによって得ることができる。ダリオはこれを、難しい斜面をスキーで滑り降りる技に例えて言う。他人に教えるためには、まず自分がその技をしっかりできるようになる必要がある、と。一方、マネジャーとしては、(経験に基づいて導き出されているために)最も価値のある意見と、推測にすぎない意見を区別する必要がある。


ch 5: フィアレスな職場
sec: 実りある衝突

→ 最後の一文は著者の言いたいことなのか、ダリオの主張なのかよくわからない。多分、前者だと思う。評者の批判「耳を傾けたとしてもだからと言って行動するかどうかは別問題である」というのはたぶん著者も理解しているだろう。だが、肝心の「最も価値のある意見と、推測にすぎない意見を区別する」方法を一切何も言っていないところに学者らしい中身のない議論である。

バリー・ウェイミラーの話

バリー・ウェイミラー(Barry-Wehmiller)という会社が紹介されていた(ch 5, sec: 従業員を大切にする)。その会社は金融危機のときに従業員を一時解雇しなかった。理由は「社員は家族」だからだという。何だか日本的な感覚だなと思った。古き良き日本経営みたいな。アメリカにも実際あったんだ。アメリカならばどこもかしこも従業員を解雇かと思っていた。

心理的安全性がない例

心理的安全性が欠けていると、ちょっとした会話にさえも支障を来しうる。その例は枚挙にいとまがない。看護師は、以前に同じ指摘をして相手の機嫌を損ねた経験が頭をよぎり、手順が違うのではないかと外科医に言うことができない。あるプロジェクトに初めて参加したエンジニアは、無知に見えてしまうのが怖くて質問できない。上司は、部下の意見を聞いたりしたら自分の能力が疑われてしまうと思うせいで、耳を傾けようとしない……。


ch 6: 無事に
sec: 自分の言葉を使う

心理的安全性の効果について

一見すると心理的安全性が高いチームだと余計なおしゃべりが増えて議論がだらだらとなるのではないかと思われるかもしれない。しかし、研究によるとそうではなく、心理的安全性の高いチームはむしろ時間を効率的に使えるようになることである。

きわめて正確・簡潔な言葉を使って成し遂げられたことを、さらに詳しく検討しよう。確かに極端なケースではあるが、一方で、この非常事態における人間同士のやりとりは、明瞭かつ率直に話しても、必ずしも議論が延々と続くだけで何の結論も出なくなるわけではないことを、説得力をもって証明している。心理的安全性があるからといって、余計なおしゃべりをしてだらだらと議論を続けることにはならないのだ。私の研究では、むしろその逆で、心理的安全性が低い経営陣のミーティングは主張に明瞭さがなく、必要な時間よりはるかに長い時間がかかっていた。さらに悪いことには、重要な決定がしばしば先延ばしにされた。明らかな対立が起きて効果的な話し合いがなされず、議論から決定までにかかるトータルの時間が、必要な時間よりはるかに(数カ月)長くなってしまったせいだった。


ch. 6: 無事に
sec: 時間を効率的に使う

現実不可能な会社目標について: フォルクスワーゲンとアングロ・アメリカン社

第3章では心理的安全性がなかった事例としてフォルクスワーゲンが取り上げられた。その社長のヴィンターコルンは会社目標を掲げたが、現場ではそれは現実的でないと思われていた。第6章では心理的安全性がある事例としてアングロ・アメリカン社が取り上げられた(sec: 労働者の安全のために率直に話す)。その社長であるキャロルも同じように会社目標として「死傷者をゼロにする」と掲げたとき、経営陣をはじめとして多くの人が「それは無理だ」と思われた。「無理な目標を掲げる」という点では両者は同じである。それは問題ではないのか? さらに、もし「聴く耳が大事」というならば、キャロルは現場の意見を尊重しなければならなかったのではないか? ましてや従業員が抵抗するとの理由で、主要鉱山の閉鎖という強行手段をしたことは「聴く耳」という姿勢の対極ではないか?

失敗について

著者は失敗にはいくつかのものがあるという。回避できる失敗を回避する第一歩は、異論や反論を受け入れて共有して学習することである。

本章の四つの組織と同様、多くの組織で、数多の小さな問題が日常的に起きている。そして会社の戦略が暗礁に乗り上げるかもしれない、あるいは再考の必要があるかもしれないという初期兆候を示している。ところが、そうしたサインは、みすみす見逃されてしまっている。ゆえに、回避できる失敗を回避する第一歩はこれだ──異論・反論を述べ、データを共有し、研究所や市場で実際に起きていることについて積極的に報告するよう社内中の人々を促し、絶え間ない学習と機敏な実行力を生み出すのである。

part II: 職場の心理的安全性
sec: 回避できる失敗を回避する

失敗の認識について

学習するためにはまず自らの失敗を「失敗」として認識しなければならない。したがって自らの失敗を認識することは大切だが、我々はしばしば自らの失敗を認めないことがある。失敗を相手にどう認めさせるのか?

学習について

著者は「学習が大事だ」としきりに言うが、「過学習をいかに避けるか」という問題には関心がない。というか、そのような視点がない。
例えば次のような状況を考えてみよう。ある会社があるとき、あるプロジェクトを開始した。しかしそのプロジェクトは失敗に終わった。失敗したプロジェクトを分析して、会社は学習したとする。つまり会社は「これこれのことはもう投資しない」と学習したのである。しかし、この学習は時に障害となり得る。というのも、時代の変遷(価値観の変化や技術革新など)によって、あるときにはできなかったことがいつかできるようになるかもしれないからである。
本書にはグーグルXという会社が登場したがその例で説明しよう(ch.5, sec: 安心して失敗できるようにする)。そこでは次世代技術の開発をおこなっている。あるチームがあるプロジェクトをおこなったが失敗したとする。グーグルXは学習して「これこれにはもう研究をおこなわない」と決めたとしよう。しかし、時代が変わり技術革新などが起こることで、そのプロジェクトは将来うまくいくかもしれない。だが、会社はすでに「これはだめ」と学習されているので、そのときにはすでに手遅れとなり、会社は後塵を拝することとなる可能性がある。
このような過学習をいかに避けるか。それは世代交代だろう。

ノート

  • 心理的安全性とは対人関係の不安の解消のことである。ここでいう対人関係とは納期や顧客やライバル企業のことではなく、上司や同僚のことである。また対人関係とは、彼らとのプライベートな人間関係でもなく、気兼ねなく質問できるとか失敗を認め合うといった関係のことを言っている。
  • 対人関係の不安の解消の仕組み
  1. 不安と失敗を分離する。失敗のプロではなく学習のプロとなる。
  2. 失敗には種類があり、失敗の意味もそれぞれ違うことを理解する。
  3. 従業員同士が学び合い教え合う環境を作る。
  4. 発言した勇気に対してまず感謝を述べること
  5. 相手を敬う。相手に関心を持つ。自分の非を認める。
  6. 次の言葉を積極的に使う。
  • 「わかりません。」
  • 「間違っていました。」
  • 「助けが必要です。」
  • 「申し訳ありません。」
  • 「どんな手伝いが必要ですか?」
  • 「どんな問題にぶつかっているのですか?」
  • 「どんなことが気がかりなんですか?」



僕から以上

シンボリックリンクについて: リンク先がNo such file or directoryとなる

概要
シンボリックリンクの注意点についてまとめる。
相対パスシンボリックリンクを書くとうまくいかなくなることがあるので注意すること。

基本的には絶対パスで書くこと。相対パスは変なことがおこる。

(続きはいつか書く)

選択ボックス(select)の操作方法について

概要
PythonSeleniumを使って選択ボックスを操作する方法をまとめる。

選択ボックスとは次のもの。
f:id:yoheiwatanabe0606:20220331180223p:plain

選択ボックスをクリックすると選択肢が表示されて、クリックするとそのページに変わる。そのような操作を自動でおこないたい。
f:id:yoheiwatanabe0606:20220331180226p:plain


ソースコード
完全なもの

import os
import time
import sys
from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.select import Select
from selenium.common.exceptions import NoSuchElementException

# initialize
## which geckodriver
DRIVER_PATH = '/usr/local/bin/geckodriver'

## no headless
driver = webdriver.Firefox(executable_path=DRIVER_PATH, service_log_path=os.path.devnull)

# go to the yahoo page
url = 'https://news.yahoo.co.jp/topics/top-picks'
driver.get(url)

time.sleep(3)

# click the select button
## find the element and create an object
css_selector = '.newsFeedFilter_select > select:nth-child(1)'
select_element = driver.find_element(By.CSS_SELECTOR, css_selector)
select_object = Select(select_element)

## click
date = '20220330'
try:
    select_object.select_by_value(date)
except NoSuchElementException as e:
    print(e)
    driver.quit()
    sys.exit()

time.sleep(3)

# go back to the top page
css_selector = '#msthdLogo > img:nth-child(1)'
driver.find_element(By.CSS_SELECTOR, css_selector).click()

time.sleep(3)
driver.quit()


別解1(インデックスパターン)

...
(中略)

#### case II: index
select_object.select_by_index(2) # 0番目基準(Zero-based numbering) 3月30日(水)

...
(中略)

別解2(テキストパターン)

...
(中略)

#### case III: text
select_object.select_by_visible_text('3月30日(水)')

...
(中略)

実行結果
f:id:yoheiwatanabe0606:20220331180231g:plain

前提知識および注意事項

前提知識

  • Seleniumをインストールして、自分の環境で一通り動かすことができること。

注意事項

今回はFirefoxを使用しているが、もちろんChromeでも同様にできる。

選択肢のタグを調べる方法

f:id:yoheiwatanabe0606:20220331180139p:plainf:id:yoheiwatanabe0606:20220331180146p:plainf:id:yoheiwatanabe0606:20220331180154p:plainf:id:yoheiwatanabe0606:20220331180203p:plainf:id:yoheiwatanabe0606:20220331180214p:plain

Vuetifyのv-text-fieldのアンダーラインの消し方

概要
Vuetifyのv-text-fieldについて、文字を記入する前も記入中にも、記入欄にはアンダーラインが記載されている。それをなくしたい。

初期状態はアンダーラインがないが、クリックするとアンダーラインが表示される。
f:id:yoheiwatanabe0606:20220131193602p:plain
f:id:yoheiwatanabe0606:20220131193605p:plain

逆もできるし、クリックするかどうか関わらずアンダーラインを消すことができる。それは次のようにclassを定義する。

ソースコード

.title-v-text-field.v-text-field >>> .v-input__slot::before {
  border-style: none !important;
}
.title-v-text-field.v-text-field >>> .v-input__slot::after {
border-style: none !important;
}


(まだ途中)

Vuetifyのv-text-fieldにおいて記入される文字が大きいと、文字の表示が隠れるバグについて

概要
Vuetifyのv-text-fieldにおいて記入される文字が大きいと、文字の表示が隠れるバグがある。ただし、そのようなバグはSafariのみに発生する。
その解決方法を提示する。


修正前


修正後

  • 左側がSafariで右がChromeでの表示。いちおう問題解決。



ソースコード

<template>
<v-app>
<div>
<v-text-field
></v-text-field>
</div>
</v-app>
</template>
<script>
export default {
  data: () => ({
  }),
};
</script>
<style scoped>
.v-text-field >>> input {
  font-size: 1.9em;
  padding: 0 !important;
}
</style>

はじめに

Vuetifyのv-text-fieldにおいて、そこに記入される文字を大きくすると、文字の表示が隠れるバグがあります。ただし、そのようなバグはSafariのみで生じます。ChromeFirefoxではそのようなバグは発生しません。
今回はそのようなバグを解決する方法を示します。

ソースコード

vueファイルのstyle箇所に次のように追加します。

<style scoped>
.v-text-field >>> input {
  font-size: 1.9em;
  padding: 0 !important;
}
</style>


padding: 0 !important;を追加することで、問題はいちおう解決しますが、いくつか注意点があります。

注意点

文字の大きさについて

アルファベットなどの半角英数字でしたら、font-size: 1.9em;ぐらいでも問題ありません。しかし、次のGIFの通り、この大きさで全角文字を入力すると、Safariでは文字は隠れてしまいます。

v-text-fieldのオプションにはfull-widthというものがあります。これは「入力のタイプを全幅(full-width)として指定する」オプションです。ですが、これを追加しても問題は解決されません。

全角文字でも問題なく表示するには、大きさはfont-size: 1.7em;ぐらいが限界だと思います。

クラス表示について

今回のコードではあるファイル内のすべてのv-text-fieldで、文字が大きくなってしまいます。そうではなくて、特定のv-text-fieldのみに適応させたい場合、次のようにしてクラスを作れば解決可能です。

<script>
<template>
<v-app>
<div>
<v-text-field class="class-v-text-field"
></v-text-field>
</div>
</v-app>
</template>
<script>

export default {
  data: () => ({
  }),
};
</script>
<style scoped>
.class-v-text-field.v-text-field >>> input {
  font-size: 1.9em;
  padding: 0 !important;
}
</style>

終わりに

フロントエンドの開発ではブラウザに依存するバグというのもあるというのがわかりました。フロントエンドの開発も大変ですね。




僕から以上

ShellScriptでMacのターミナルから新しいターミナルを開く方法

概要
Maczshのターミナルを開いているとき、新規のターミナルを開き、そこでコマンドを実行する方法を示す。

ショートカットキーを用いるとき、commandnを押すと、新規のターミナルが開く。このような操作をShellScriptでおこなうやり方を示す。

ShellScriptで新しいターミナルを立ち上げて、そこでShellScriptのコマンドを実行する。

次のコマンドを実行すると、単に新しいターミナルが開かれます。

osascript -e 'tell application "Terminal" to do script'




zshで次のコマンドを実行すると、別のターミナルが出て、そのターミナルにhelloが表示されます。

osascript -e 'tell application "Terminal" to do script "echo hello"'

あとは"echo hello"を自分の実行したいコマンドに変更すればいいです。



僕から以上