• このエントリーをはてなブックマークに追加
Vol.428 結城浩/家族へのアドバイス/プログラミングで理解できないときのモチベーション/Webサイト「結城浩のPDF」を作る(4)/幸せな学生生活だが成長に不安/
閉じる
閉じる

新しい記事を投稿しました。シェアして読者に伝えましょう

×

Vol.428 結城浩/家族へのアドバイス/プログラミングで理解できないときのモチベーション/Webサイト「結城浩のPDF」を作る(4)/幸せな学生生活だが成長に不安/

2020-06-09 07:00
    Vol.428 結城浩/家族へのアドバイス/プログラミングで理解できないときのモチベーション/Webサイト「結城浩のPDF」を作る(4)/幸せな学生生活だが成長に不安/

    結城浩の「コミュニケーションの心がけ」2020年6月9日 Vol.428


    目次

    • 妹にアドバイスするのが難しい - 教えるときの心がけ
    • プログラミングで理解できないとやる気が削がれる - 学ぶときの心がけ
    • Webサイト「結城浩のPDF」を作る(4)
    • 幸せな学生生活だが成長に不安

    はじめに

    結城浩です。

    いつもご愛読ありがとうございます。

    「はい」の話。

    丸山さとこさんが描いている「コウくんとの対話」をいつも楽しく読んでいます。先日読んだ「今からやろうと思ってたところ」もおもしろい話題でした。

    食事が終わったときに「食器流しに運んでね」と言われたコウくんが「今からやろうと思ってたところだよ」と返事したときのやりとりです。

    ◆「今からやろうと思ってたところ」|丸山さとこ
    https://bit.ly/3cHh4nT

    もしも「アンタ片付ける気ないでしょ」と言われて(自分は違うぞ)と反論したいときならば「今からやろうと思ってたところだよ」でいい。

    でも「食器流しに運んでね」と言われて(自分もそうしようと思っている)ならば「はい」でいい。

    面倒を回避できるからいつでも「はい」と答えておくという態度は別のトラブルの元になるし、かといっていつも自分の気持ちを詳細に語るのがいいとも限らない。

    相手の考えと自分の考えは合っているだろうかと考え、合っていたら「はい」でいいし、違っていたら気持ちを語るのもいい。

    そのようなアクションを取るためには、相手の言ったことを理解し、自分の気持ちを理解し、その上で適切な表現を選ぶ態度が必要になる。確かにこれはソーシャルスキルかも知れません。

    単なるパターンマッチでは済まないともいえます。

    • 相手が何を言おうともハイハイ言う。
    • 相手が何を言おうとも自己主張する。

    この二つは、表面的には真逆に見える態度ですけれど、相手の発言を聞いていないという点ではよく似ているんですね。

    * * *

    アイキャッチ画像の話。

    結城はnoteをはじめとして、ネットにいろんな文章を公開しています。そのときに「アイキャッチ」となる画像を作ることがよくあります。きれいな画像を背景に、タイトルと、結城のアイコンである「スレッドお化け坊や」を配置したものですね。

    以前はひとつひとつ手作業で作っていたのですが、さすがに大変なので、Rubyで作ったスクリプトで半自動生成するようになりました。「半自動」といったのは、画像の選択は結城自身が行っているからです。

    ところで最近、このスクリプトを微調整しました。いままではタイトル(たとえば「結城浩のメールマガジン」)を単純に黒にしていたのですが、それだとややキツイ印象になることが多かったからです。

    文字の色を、背景となる画像に色合いを合わせてみたらどうかなと思い、スクリプトを動かすときに色コードを指定できるようにしました。するとなかなかいい感じであることがわかりました。

    しかし、背景画像は毎回変わりますから、そのたびごとに手動で色を調べるのは手間です(これを手間と呼ぶとデザイナーさんから怒られそうですね)。なので、これも自動化したいという気持ちが浮かびます。

    ここまで考えてくると、課題は「背景画像の主な色合いをもとにして、テキストの色を自動的に決定せよ」となります。背景画像の色を1ピクセル単位で調べることはImageMagickを使えばできますが、「主な色合い」ってどうするんだろう……としばらく考えていました。

    ◆ImageMagick
    https://imagemagick.org/

    検索してみたところ「画像を1ピクセルに縮小し、そのピクセルの色を調べる」という解法がStackOverflowで見つかったので、その方法を採用することにしました。これを見たときは「頭良いなあ」と思ったものです。

    ◆How to find average color of an image with ImageMagick?
    https://stackoverflow.com/questions/25488338/how-to-find-average-color-of-an-image-with-imagemagick

    三つくらいのサンプル画像で比較してみました。ちょっと違いがわかりにくいかもしれませんが、左側が黒のテキストで、右側が画像の色に合わせたテキストです。私が期待したように、やさしくなじんだ画像になりました。満足です。

    ◆テキストの色を背景画像に合わせて自動選択

    20200608092602-44b7d044d0f15d0f.jpg

    * * *

    それでは、今回の結城メルマガを始めましょう。

    どうぞごゆっくりお読みください。

     
    この記事は有料です。記事を購読すると、続きをお読みいただけます。
    ニコニコポイントで購入

    続きを読みたい方は、ニコニコポイントで記事を購入できます。

    入会して購読

    この記事は過去記事の為、今入会しても読めません。ニコニコポイントでご購入下さい。

    コメントを書く
    コメントをするにはログインして下さい。