この本のキーワードになっているのがトンガ語の「アンガ」で、なんとこれが日本語でいうところの「態度・ふるまい」です。この2つの点で面白い話が聞けるかな、と考えてお招きした次第です。 それでは最初の質問にはいりましょう。比嘉さんが共著で書かれた、「地道に取り組むイノベーション」（ナカニシヤ出版／2020年10月）で、衝撃をうけた一節があります。 文化人類学会に所属している約2000人のうち、人類学の領域の外で研究している人はおよそ50人ほどしかいないと、その閉じた構造を指摘されていました。その辺のことをお聞きしたいです。比嘉さんは50人の中でも特に積極的に企業とも協働されていて、かなり珍しいスタンスを採られていると思われますが、比嘉さんはなぜそれができていらっしゃるんでしょうか。 比嘉：なんででしょう・・・？。なんていうか、そうしなければっていうよりは、そうではないことが不自然っていうか。さっ

はじめに 前回は、エンドユーザーの「意見」ではなく「⾏動」、すなわち「実際にしたこと」を調べることが大切、というお話しでした。 エンドユーザーの「⾏動」を調べるには、いくつかの方法があります。代表的なものは、過去の⾏動にフォーカスしてユーザーインタビューする方法や、現場に⼊ってユーザーの⾏動を観察するエスノグラフィという方法などです。 UXデザインは、ユーザー⼼理を明らかにする専⾨技術ですが、そのすべての基本となるのは「ユーザーに会う」ことです。 そこで今回からは、UXデザインのはじめの⼀歩として入りやすい、「ユーザーインタビュー」にフォーカスしていきます。 ユーザーインタビューで気をつけること ユーザーインタビューとは、エンドユーザーに話を聞くことです。しかし、ただユーザーに話を聞くことと、インタビューすることには、ちがいがあります。 どのような点に気をつけていくか、見ていきましょう。

Autoprefixer 9.7.1 を使って CSS Grid の IE 対応をします。いろいろ制限や要件ことに応じて書き方や癖があるので、気になる範囲をまとめていきます。 Autoprefixer の設定 Autoprefixer の引数に grid: 'autoplace' を渡します。いくつかの例を書いておきます。 webpack postcss.config.js module.exports = { plugins: [ require('autoprefixer')({ grid: 'autoplace' }) ], }; Gulp gulpfile.js gulp.task("default", () => { return gulp.src("src/style.css") .pipe(autoprefixer({ grid: 'autoplace' })) .pipe(

痩せる！集中力が高まる！肩こりが直る！仕事が捗る！ 普段エンジニアとして仕事をしていて、デスクワークなので肩がこる、運動量すくないから太るんだ、甘いもの取ったら集中力が上がる、野菜ジュース飲んだら健康になる、と思って生きてきたけど、ここ最近やっているダイエットを通してライフハックを見つけてしまったので共有したくnoteにしてみました。 Self Rizap最近、Self Rizapというダイエットしたい人が共にダイエットしながらダイエットについての研究をするSlackを立ち上げてダイエットに勤しんでいます💪💪💪 参加者の方は毎食食べたものを投稿するようにしてます。Rizapの根本のコアビジネスは継続する仕組みを提供すること、だと僕は思っているので他の人と一緒にすることで同調圧力があるのと、投稿を促すことで日々自分に対してのリマインドの数を増やせると思ってSelf Rizapを立ち上げ

BEMのいいところは、それが何者なのかが明白ということに尽きる。とある要素を見たときに、そのスタイルがどこに書かれているのか、何を表しているのかがクラス名を見ればわかる。手を入れる際も、どこに追記すればよいのか、どれくらいの影響を及ぼすのかの大部分が推測できる。 レスポンシブ・デザインと相性がいいとか、流行りのコンポーネント指向と相性がいいなど、BEMの良さは他にもいくつか挙げられるけど、決定的なのは明瞭さであると思う。 BEMを使いはじめてかれこれ３，４年くらい経った。その間に色々な命名規則や設計思想が登場してきたけれども、今のところは浮気する程の魅力を他に感じることもなくBEM一筋でやってきている。ただし実践するにつけて、より明瞭で破綻しづらい設計を実現するために、様々な制約やガイドを設けてやってきたので、「もともとのBEM」からは多少なり離れているかもしれない。 ただし、それはBEM

そんな声を、そう珍しくない頻度で耳にします。（先月だけで2度耳にしました。） これはデザイナーにとって明らかに醜悪な話ですが、実はビジネスにとっても最悪な計画です。 言いたいことは分かります。 賢明な彼らには「デザインに凝るよりも、仮説検証が先だ」という意図があるのです。 しかしそんな彼らに伝えたいことがあります。 それは、 「ソリューションやコンセプトが正しく伝わらないと、仮説検証に致命的なノイズが生まれる」 ということです。 「最低限のデザイン」とは？ 先に言っておくと、UIデザインを1週間で形にすることは可能です。それどころか、1日2日で作ることも可能かもしれません。 また、初期フェーズ等においてはデザインが最低限のもので構わないことには大いに同意できます。 最低限というのは、ソリューション検証に耐えられるだけのデザインを指します。 検証のためにはまずきちんとソリューションとコンセプ

This domain may be for sale!

前回の記事でCSS Gridは「魔法の杖」だと書きましたけど、1つ気になっていたことがあります。 それは、HTMLソースの順番（ソースオーダー）と視覚的な順番（ビジュアルオーダー）にまつわるアクセシビリティについてです。FlexboxでもそうなんですがCSS Gridを使うとCSSで表示順を変更することができます。そうするとHTMLソースにあるコンテンツの順番とブラウザで表示される順番が異なる場合が出てくるわけですね。 「でも、それってアクセシビリティ的にはどうなんだろう？」というのが気になっていました。 マルチデバイス対応のレイアウトを考える際、CSSで表示順を変えられるのはものすごく便利で、まさにここがCSS Gridの「魔法の杖」的な要素の一つでもあるわけです。でも、技術的にできるからといって考えなしにやっていいかというと、そんなことはないですよね。 調べてみたところ、CSS Gri

社内の2017新卒向けブートキャンプ ( 研修 ) にて使用したスライド資料ですが、せっかくなので一般公開します。

街角のクリエイティブは、ただいまリニューアル準備中です

いってきたよ！ small画面でも、BIG画面でも、今すぐ使えるレスポンシブ活用術 by @ourmaninjapan オニール(O'NEILL)のサイトをレスポンシブにしたらコンバージョンがUPした例 モバイル対応はモバイルのためだけではない PCでもウィンドウせばめて見たりするよね モバイル専用にするか、レスポンシブにするか もはやモバイル = iPhoneではない 画面解像度もユーザー層によって違う ギークな人たちの画面解像度はw1200↑がほぼ そうでない人たちはw1200以下が多く、w400あたりが最も多い そしてモバイル = 小さい画面でもない 表示を最適化することが真のレスポンシブ レスポンシブで気をつける点 入力デバイスを考慮 タップできる領域・余白 ロールオーバーとか おすすめレスポンシブ実装10 meta[name=viewport] scalable=noはだめ！ぜっ

EngineeringDelivering Octicons with SVGGitHub.com no longer delivers its icons via icon font. Instead, we’ve replaced all the Octicons throughout our codebase with SVG alternatives. While the changes are mostly under-the-hood, you’ll immediately feel… GitHub.com no longer delivers its icons via icon font. Instead, we’ve replaced all the Octicons throughout our codebase with SVG alternatives. While

「私、男ウケがいいからよく女から嫉妬されるんだよね♡」 「男と一緒の方が楽で、同性の友達が少ないんだよね♡」 「自分のことが一番じゃない人間なんているの？♡」 と、Twitterのキラキラアカウントよろしく、自己愛・承認欲求の鬼であるモテ女子（自称）たちが立て続けにハイスペモラハラ男子と結婚しました。 おめでとうございます。彼女たちの結婚を心から祝福します。 ブライダルのプロとして働く友人が「あそこは3年以内に女子が不倫に走るか、モラハラが加速して女子がメンヘラ爆発すると思う」と見立てていて私もまったく同感すぎます。でも私たちは何も言わない。ただ祝福だけする。 家族にウルトラハイスペのモラハラ男がいたせいで、どんなに「優秀で素敵な彼ぴっぴなの〜」と事前情報インプットされても、会った瞬間「父さん！妖気が！モラハラです！」と体がビクンビクン反応してしまう私としては、大事な友達だったら「もっとい

リスト要素で実装したナビゲーションの右端のボーダーを取り除くシンプルな方法、flexboxで実装したカラム間の溝の最後の溝を取り除く方法、天地の中央に配置など、知ってると便利なCSSのテクニックを紹介します。 CSS Protips -GitHub CSS Protipsのバージョンアップ版の紹介記事はこちら。 CSSでやりたかったことが数行のコードで実装できるスタイルシートの小技のまとめ -CSS Protips CSS ProtipsのライセンスはMIT Licenseで、個人でも商用でも無料で利用できます。 下記のスタイルシートの対応ブラウザはChrome, Firefox, Safari, Edge, IE11です。 リスト要素の最後だけボーダーを適用・削除 body要素に「line-height」を加える 天地の中央に配置 ネガティブなnth-childを使用してアイテムを選択

最近、20世紀を代表する政治学者であるピーター・ドラッカー氏がメンターとして経営者たちと接する中でのやり取りをまとめた『A Year with Peter Drucker』という本が話題になっています。ドラッカー氏をメンターとした経営者の中には、同じく20世紀を代表する経営者として知られるゼネラル・エレクトリック社の元CEOジャック・ウェルチ氏を始めとした大物が名を連ねています。 メンターを持つことは、外資系企業のエグゼクティブの間では比較的ポピュラーで、ビジネス上で重要な職責を担う立場の人物や経営者たちが、重要な決断する手助けや日々のプレッシャーと対峙して打ち勝つために大いに活用されています。 メンターとして設定する人物は、ドラッカー氏のように、ビジネスにおける抜群の知見や実績を持ち、相手の話を引き出し、有意義なやり取りができるスキルを持った人物であることが理想的です。しかし、なかなかそ

The ultimate goal of any CSS is to style the intended element with selectors that do not introduce side effects to the rest of the code base. Seemingly a simple request, but on large projects that lack structure or guidelines this task can lead to some pretty ugly usage of CSS. “…the single hardest problem in CSS: Getting your rules to match the elements you want, without them accidentally matchin

Updated 2015.04.27 / Published 2015.04.27 「ファーストビューが全て」のようなファーストビューについては盲信的な記事も多く、ファーストビュー云々のことで煙が立ち始めて、火がついてしまうと、上手く説得を試みようにも聞く耳をもってもらえず、困り果てるディレクター・デザイナーの方も多いのではないかと思います。ファーストビューはもちろん大事ですが、盲信的に傾倒することには疑問を感ぜざるを得ず、ファーストビュー問題はいつになっても考えものです。 ファーストビューのボヤは気付き難い ディレクターやデザイナーの方ならプロジェクトが進行していく中で、ファーストビューが問題になったことが一度や二度はありませんか。「いやいや、ファーストビューはちゃんとガチガチに予防線を張っているよ！」というディレクターの方も、きっと過去に苦い経験があるのではないでしょうか。 個人的にフ