先日サンフランシスコ市内にある丸亀製麺 (アメリカだとMarugame Udon) に行った。コロナの期間は閉店していたが、今年に入ってからは営業を再開している。地元の人たちにも大人気の繁盛店。 入口でトレイを取り、列に並んで、カウンター越しにオーダーを行う仕組み。 そこであることに気づいた。 「めっちゃ人多くない?」と。それも、お客さんだけではなくて、従業員の数が。 従業員がめっちゃいる。列に並んでいる客と同じぐらいに。そして、それぞれのスタッフが “一つ” の作業しかしていない。
フォームを改善するUIデザインのテクニックを紹介します。 フォームのデザインに少し手を加えるだけで、ユーザーにとって使いやすい、コンバージョンを高めるための実践的なテクニックが満載です。 15 UI Tips for Better Forms by Jim Raptis 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 01. ラベルを常に記述する 02. Zパターンを避ける 03. ラベルを入力欄の上に配置する 04. 右揃えのラベルを使用する 05. 関連する入力欄をグループ化する 06. ユーザーフローを尊重する 07. スペースを与える 08. ラベルの繰り返しを避ける 09. エラーメッセージは分かりやすく 10. 必要に応じてドロップダウンを使用する 11. プレースホルダーを活用する 12. ボタンは1つに
どうもoreoです。 今回はモダンなJavaScript開発環境で役立つデザインパターンを紹介します。 この記事は、JavaScript Patterns WorkshopとPatterns.devを参考にしています。 有名な「Java言語で学ぶデザインパターン入門」などでは、古典的な23個のデザインパターンが紹介されていますが、JavaScript Patterns WorkshopではPatterns.devをベースとして、モダンなJavaScriptにおける6つのデザインパターンについて言及されています。この記事ではそれらについてまとめてみたいと思います! ※本記事中のコードは、JavaScript Patterns WorkshopとPatterns.devから引用させていただいております。 1 Design Patternsとは? デザインパターンとは、ソフトウェア開発で繰り返し
どうやら少し前から話題になっていたようですが、今朝僕のツイッターのタイムラインに流れてきた、こちらのツイート。 軽井沢プレミアムアウトレットモールに毎年3回は来る者なのですが、完全に「来てはならない場所」になってて涙。正規店には置かないアウトレット専用の低劣品を混ぜて情弱に売るのはよくあったんだけど、もはや今は「それしかない」 正規店に置いているレギュラー品は、ぶっちゃけ公式webショップで pic.twitter.com/QRMgpUKIsj — アムロ・ジ・エンド™️ (@amurosansan) 2023年4月29日 「正規店には置かないアウトレット専用の低劣品は、いわゆるアウトレット専売品ですね。を混ぜて情弱に売るのはよくあったんだけど、もはや今は「それしかない」」 とっても辛辣な表現ですが、よくわかります。 大手セレクトショップのアウトレット専売ブランド 「正規店には置かないアウ
基調講演「30分でわかるデータ指向アプリケーションデザイン」 ・ スピーカー 斉藤 太郎氏 Twitter:@taroleo / Github:@xerial Principal Software Engineer , Treasure Data 東京大学理学部情報科学科卒。情報理工学 Ph.D。データベース、大規模ゲノムデータ処理の研究に従事。その後、スタートアップであるTreasure Dataに加わり、アメリカ、シリコンバレーを拠点に活動中。日本データベース学会上林奨励賞受賞。OSSを中心にプログラミングやデータ処理を簡単にするためのプロダクトを作成している。 「30分でわかるデータ指向アプリケーションデザイン」最新の論文にも触れながら、分散データシステムの世界の魅力を伝えていきます。後半、@tagomoris https://t.co/TQ2TnsFIOT… — Taro L.
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。Yahoo!ニュースでデザインを担当している萩野と小股です。 Yahoo!ニュースは、Yahoo! JAPANが運営する国内や海外のニュースを閲覧できるサービスです。1996年にサービスを開始し、2021年には25周年を迎えました。 そんなYahoo!ニュースでは、2020年より「Figma」を用いてデザイン業務を行っています。この記事では、Figmaの利用に至った背景や、運用し続けられるものにする工夫、デザインシステムによってデザイン業務がどのように効率化されたか、お伝えします。 Yahoo!ニュースが抱えていたデザインにおける課題と解決方法 この章では、Yahoo!ニュースが当時抱えていた複数のデザイナーがデザイン
ヤンマーは6月20日(火)、同社が2022年11月に発表した同社が製作・プロデュースするアニメプロジェクトを本格始動、作品タイトルを『未ル』に決定したことを発表した。同作は2024年に公開される。 ヤンマーはトラクターや船舶エンジン、エネルギーマネジメントシステムの開発など多岐に渡る事業を展開している企業。1912年に創業し、「A SUSTAINABLE FUTURE」をパーパスとして掲げている。 テーマは「人と自然の対峙と調和」。住環境を守るべく、仲間と協力し、ロボットと関わりながら成長していく主人公を描く。また、タイトルの『未ル』は未来を切り開いていく姿をイメージし、「未来」を動詞化したものとなっている。 ロボットデザインの原案は農業機械や建設機械をはじめ、各種グラフィックなどのデザインを手がけるヤンマー社内のデザイン室が担当。有機的なフォルムと機械的なアタッチメントを併せ持つ、本作な
皆さん、「テレ朝UD」はご存知でしょうか? テレ朝UDは、テレビ朝日の長年の経験に基づくテレビテロップの知見と強いこだわりを、フォントワークスのフォント制作の技術で実現したオリジナルフォント。2022年10月から以下の報道番組のテロップに使用されています。 2022年10月からテロップに「テレ朝UD」を使用している報道番組テレ朝UDの開発背景や、書体の特徴については、フォントワークスのコーポレートサイト「もじがたり」で紹介されていますので、ぜひそちらもチェックしてみてください。 そしてもじがたりの取材のため、テレビ朝日 コーポレートデザインセンターにお話を聞きに行くと耳に挟んだ編集部。これはじっとしていられません。「何か面白い話がうかがえそう!」と取材に同行させてもらいました。 テレビの現場の方にお話を聞けるなら、やはりデザインについて勉強させていただきたい! 「ニュースの画面ってどんなふ
轍 @wadachi8891 網膜に空いた穴をレーザーで塞ぐために瞳孔をガン開きにする目薬してもらったんだけど、術後6時間はとにかく焦点が合わないから「今だ!」って思ってデザインがダサいと噂の新紙幣と現行の紙幣の画像を見てみた。 2021-09-04 22:33:48 轍 @wadachi8891 もう全然違う!!現行紙幣では数字が小さい上に色も背景に馴染んでて、10000なのか1000なのか分からない。漢字に至っては潰れて見えるし、色もぼんやりだからわかりづらい。新紙幣は数字の部分・漢数字・人物がはっきりと見えて容易に判別が可能だった。数字が大きいこと、特に0が大きいのは本当に良い 2021-09-04 22:39:10 轍 @wadachi8891 瞳孔ガン開きで手元15〜30センチの文字や顔の判別がブレッブレの状態で、数字が判別できるのすごい。というか数字部分だけ焦点あってるんじゃな
通常のタクシーよりも大型で障害者などが乗りやすいとして国が導入を進めている「ユニバーサルデザインタクシー」で、車いすの利用者が乗車を断られたケースが相次いでいたことが障害者団体の調査でわかりました。国土交通省は、全国のタクシー会社で作る団体に通達を出して適切な運用を求めました。 「ユニバーサルデザインタクシー」は障害者や高齢者でも乗りやすいよう、通常よりもドアが大きく車内のスペースも広く作られたタクシーです。 「ユニバーサルデザインタクシー」の利用状況を、障害者が作る団体の「DPI日本会議」が先月、全国で調査したところ、車いす利用者の延べ120人のうちおよそ27%にあたる32人が乗車を断られたと回答していたことがわかりました。 こうしたことなどから、国土交通省は今月19日、全国のタクシー会社で作る団体「全国ハイヤー・タクシー連合会」に対し、ユニバーサルデザインタクシーの適切な運用を求める通
独裁ちゃん @dokusaichan 「ピアスや指輪の意味!」とか「花言葉!」とか「瞳の色の意味!」「右目を隠しているキャラクターは過去に執着がある!」「黒手袋は自分を汚れた存在だと思っている!」みたいな情報を見るたびに、絵描きのワイはただのデザインなので黙っててもらっていいですか?と思っている✌️ 2024-01-05 12:27:36 独裁ちゃん @dokusaichan 少なくとも私はキャラクターのデザインにそういう意味合いは持たせてないし、他人が勝手に決めてるよくわからんルールに則ってキャラクターを解釈されるの意味わかんなすぎるからやめてほしいです。『デザイン的に映えるかどうか』以外にないよばーかうんち 2024-01-05 12:32:06
TEDで大人気になったトークや、著書『WHYから始めよ! インスパイア型リーダーはここが違う』で有名なサイモン・シネック。成功する会社とそうでない会社の違いや、ビジョンやパーパスの重要性を説く彼は、アメリカをはじめ世界中でリーダーシップを学ぶ多くの人々から支持を得ている。 彼の提唱するスタイルは「サーバントリーダーシップ」と呼ばれるもので、21世紀のリーダー手法として取り入れている企業も多い。 今回は冒頭のトーク以外にも数多くの素晴らしいスピーチを行っているサイモン・シネックから、リーダーシップに関しての12のポイントを、動画と共に学ぼうと思う。 1. 世界最強チームメンバーに共通する特徴とは?会社が成長するには優れたチームが必要になる。しかし、どうすれば優れたチームを生み出すことができるのか?そこで彼が注目したのが世界最強と言われるアメリカ海軍のエリート部隊、ネイビーシールズだ。 彼は実
デザインはちょっとした一手間を加えるだけで、ぐっとよくなります。 プロのUIデザイナーによるWebページやスマホアプリのUIとUXを改善するデザインの知識とテクニックを紹介します。 2022年上半期に公開した中で最も注目されたUIデザインのテクニックをまとめました。 UI & UX Micro-Tips: Best of 2022 by Marc Andrew 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 1. ダークにデザインする時はホワイトも和らげる 2. フォームのエラーは色だけに頼らない 3. ユーザーが選択したアイテムを目立たせる 4. 細いフォントは暗いカラーにする 5. 次のステップの情報を提供する 6. 最も重要な要素をより目立たせる 7. 検索ボックスの幅は広くする 8. 素早いアクセスは、ナビゲー
はてなブックマークでは、ブックマークコメントの下に設置している「はてなスターを付けるボタン」を見直し、これまでよりも快適にお使いいただけるようデザインを変更しました。この変更は、PC・スマートフォンのブラウザ版が対象です。 「はてなスターを付けるボタン」の主な変更点 これまでコメントの下に設置していたボタン( )は、サイズが小さく、押しづらいという課題がありました。これを解決するため、今回のデザイン変更では、ボタンのサイズを大きくし、設置場所をコメント欄の右側へ移動させました。 さらに、自分がつけたスターの色を確認しやすくしました。例えば、黄色のノーマルスターを付けた場合は、コメント欄の右側にあるボタンがグレーから黄色に変わります。一つのコメントに複数の色でカラースターを付けている場合は、最もレアリティの高い色が表示されます。 「はてなスターを付けるボタン」変更後のイメージ カラースターを
データ視覚化やダッシュボードデザインは文字通り「視覚化」「デザイン」というくらいですので、目に見えているところだけを語られがちです。しかし、実は最も重要なのは徹底したオーディエンス(ユーザー)主義の意識、そして質の高い問いの設定です。なぜなら、オーディエンスは、つまらないと感じたり、わからないと感じるとすぐに離脱するからです。これはとても単純で当たり前とも言えるのですが、データ視覚化に夢中になっていると忘れがちなポイントです。 下図は、ダッシュボードに表れるものとその根底に潜む要素を模したものです。データ視覚化の深層部分はこのような氷山で説明できるのではと考えています。 上側半分はよく語られがちですが、下側は見過ごされがちです。ですので、本記事では、上側から下側まで一気通貫のチェックリストを紹介します。弊社では、プロジェクトの開始時から最後まで考えていることです。これらの要素は相互に影響し
先日ローンチされたばかり、500種類以上のランディングページのデザインをまとめたLandingsを紹介します。 ランディングページのデザインは、テーマやカラーでフィルタリングができ、アイデアを膨らませるのに役立つと思います。 Landings Landingsは今月の初めにローンチされたばかりのランディングページのまとめサイトです。現在のところ、500種類以上のランディングページのデザインがまとめられており、これからも定期的に追加していくとのことです。 Landings Landingsの利用は簡単で、登録など面倒なことは一切不要。 ページは無限スクロールに対応しているので、そのままスクロールしてもよし、上部でテーマやカラーでフィルタリングすることもできます。 フィルタリングを見てましょう、まずはライトテーマ。 各サムネイルをクリックすると、ページ全体のキャプチャ画像とランディングページの
SOW@ @sow_LIBRA11 作家のはしくれでございます。「戦うパン屋と機械じかけの看板娘」(HJ文庫)全10巻。「剣と魔法の税金対策」(ガガガ文庫)全6巻「機動戦士ガンダムSEED ECLIPSE(ストーリー担当)」ガンダムエースにて連載中です! SOW@ @sow_LIBRA11 そういや、「六芒星」って今は魔法的なシンボルで漫画とかで使っちゃいけなくて、「特定の国や民族を意味するため」って理由なんだが、なので昔は胸に六芒星があったキャラが、今は違う意匠で再デザインされていたりするんですよ。 2023-10-09 15:58:42 リンク ダイヤモンド・オンライン 六芒星を描いたwebマンガ非公開に…表現の「自主規制」どこまで? 昨年末、ある漫画家のTweetが物議を醸した。作中に「六芒星」が描かれているという理由から、漫画投稿サイトの運営元によって、作品が非公開にされてしまった
元増田です。 藝大デザイン科卒の大先輩からご回答をいただけまして大変嬉しいです! まずは、私のような若輩者に対して、ここまで親身になっていただき、藝大受験における詳細な体験描写も交え基礎教養や広い視野の重要性を説いてくださったことに本当に感謝申し上げます。 隅から隅まで拝読致しました。一文一文が私の琴線を強く打ち、全身を稲妻が走るような興奮と感動を覚えました。ありがとうございます! 高校で得られる基礎教養につきまして、私が軽視していたことは否めない事実です。高校というのは現代においては退屈な義務教育の延長であり、その授業内容というのもまた中学の内容の延長であり、あくまで大学入試のために設けられたノルマとしての学科であるから真剣に学ぶ必要のないものと勝手に決めつけていました。しかし、実は高校で学ぶ教養というのは人生において後々実り、視野を広げる重要なものであると、多様な学びの礎となるものだと
依頼、調整、合意、承認、etc. こういったコミュニケーションがチーム境界を越えて頻発すると、ソフトウェアプロダクト開発のフローは遅々として進まなくなります。いずれも、機能追加や機能改善を進める上でのクリティカルパスを引き伸ばす要因を生み出すからです。 機能追加や機能改善といったひとつひとつの開発は、アイデアを生み出し、それを価値に変えるまでのフローです。フローが進む過程で、組織内の様々な人の手で、様々なタスクが実行されます。その全てを1つのチームで完結することは、プロダクトの規模が大きくなるほど困難になり、より多くの人々が関わるようになります。そこに、チーム境界を越えた「依頼、調整、合意、承認」といったコミュニケーションが発生するのです。 開発フローのクリティカルパスを悪化させるこのようなコミュニケーションの頻度をどれだけ減らせるか。組織設計、チーム設計で最も注視すべき観点の1つは、そこ
前提としての情報 単に「Figmaで要件定義のためのUMLも、外部設計のためのデザインも、内部設計のためのERDも全部つくるよ〜〜」という話をすると、ERD書くならデザインツールなんて使わないで、DBMSから自動生成できるツールとか使った方がいいじゃん、みたいな疑問が出るのは重々承知なので、そもそもこの形式に落ち着いた前提事項を書いておきたいと思います。 ご興味がなければ読み飛ばしてください。 筆者の仕事範囲 さて、冒頭で「事業会社でデザイナーとPMの狭間みたいな仕事をしてます」と書きました。キャリアの背景的には受託のPMっぽい仕事(厳密には違うんですが、本旨ではないので割愛します)→事業会社のインハウスデザイナー→現職という感じで、外渉から手を動かす所まで、必要ならなんでもします。 ざっくりいうと、機能の起案をして、経理などの関連部署に相談して、WBS引いて、UML書いて、画面遷移図書い
東京オリンピックまで1年となり、オリンピックのメダルのデザインが発表されました。シンプルで、かつ立体的で、どこから見ても美しく光るよう工夫されたデザインになっています。 大会組織委員会は東京オリンピックの開幕まで1年となった24日、東京 千代田区で記念式典を開き、オリンピックのメダルのデザインを発表しました。 メダルは、おもて面がギリシャ神話の勝利の女神ニケや、大会の正式名称とすることがIOCの規定で決められていて、デザインされた裏面に東京オリンピックのエンブレムが描かれています。 裏面はシンプルなデザインな中にも、選手がメダルを胸にかけたときに輝きを放つようにと、立体的に、すべての曲面が違う角度で構成されていて、どこから見ても美しく光るのが特徴です。 メダルは全国から集められた携帯電話などのリサイクル金属から作られ、直径はロンドン大会やリオデジャネイロ大会と同じ85ミリ、厚みは最大で12
デザインパターン (design pattern) とは、過去のデザイナーたちが見つけた経験則的な型に対して名前をつけ、型の再利用性を高めやすくしたものです。ソフトウェアデザインの世界(特に、プログラミングの領域)においてはプログラム構造の設計パターンのことをまさに “デザインパターン” を呼び、これを共通の知識として積極的に取り入れています。 これに対しアンチパターン (anti-pattern) とは、必然的に否定的な結果に至る型を指します。アンチパターンもデザインパターンの一種と捉えこれを知識に蓄えておけば、設計の過程でどのような結果に至るのかを事前に予測することができるし、失敗を未然に防ぐことも可能となります。 今回は、アプリケーションデザインにおける典型的なアンチパターンをいくつか紹介します。 アプリケーションデザインの定義 ここでの「アプリケーションデザイン」の言葉は、以下の意
先週、各国のブランドロゴの考察として下記のポストをリリースした。主に、日本企業の多くのロゴが、数十年前から普遍的に ”文字ベース” のスタイルを利用していることが多いという内容だ。 なぜ日本のブランドロゴは文字ベースのデザインが多いのか? ありがたいことに、この内容に関して、大変多くの反響をいただいた。その中でも、下記のような多少の批判も見られた。 前回のポストに対する暖かいご意見 日本にはシンボルマークがないかのような誤った印象操作にも腹が立つ 選び方が恣意的すぎる!たとえば Fortune 500 (からB向け企業を抜いたとしても) 基準に沿って挙げるとこういう偏りにはならないはず 恣意的な抽出そのものだよな。 タイガー魔法瓶と象印に謝れ! なので、できるだけロジカルに検証してみた上記のほとんどが、それなりの真実味があると考えられる。ということで、フォローアップとして、本当にそうなのか
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く