タグ

UIに関するTokyoHeadTerminalのブックマーク (10)

  • Mobbin — UI & UX design inspiration for mobile & web apps

    Discover real-world design inspiration.Featuring over 1,000 iOS & Web apps, and 400 sites — New content weekly.

    Mobbin — UI & UX design inspiration for mobile & web apps
  • カーブとサーフェスの連続性 - Plasticity Manual

    カーブとサーフェスの連続性 カーブやサーフェスの連続性とは、形状の滑らかさと品質を指します。連続性は、隣接するセグメントの位置、方向、曲率、曲率変化率の一致度によって決定されます。 カーブの連続性 カーブの連続性には、G0、G1、G2、G3の4つのレベルがあります。 G0: ふたつのカーブが接続されていますが、接続点で位置のみが一致しています。 G1: ふたつのカーブが接続されており、接続点で位置と方向が一致しています。 G2: ふたつのカーブが接続されており、接続点で位置、方向、曲率が一致しています。 G3: ふたつのカーブが接続されており、接続点で位置、方向、曲率、曲率変化率が一致しています。 より滑らかで自然なカーブを描くには、より高い連続性が求められます。 サーフェスの連続性 サーフェスの連続性には、G0、G1、G2の3つのレベルがあります。 G0: ふたつのサーフェスが接続されて

  • UI要素のサイズ、マージン、角丸、フォントサイズに至るまで、すべてが黄金比に基づいて設計されたUIフレームワーク -LiftKit

    黄金比をWebサイトやスマホアプリのUIデザインに取り入れようと思ったことがある人は少なくないと思います。古い記事ですが、黄金比をサイトのデザインに取り入れる簡単な3つの方法というのもあります。 さまざまなUI要素のサイズ、マージン、角丸、フォントサイズに至るまで、すべて黄金比に基づいて設計されたUIフレームワークを紹介します。 LiftKit LiftKit -GitHub LiftKitは、黄金比に基づいて設計されたUIフレームワークです。Material 3の視覚調整された設計やダイナミックカラーといった高度なビジュアルデザイン機能を実現する数式と変数のセットです。 ライセンスはApache License 2.0で、個人でも商用プロジェクトでも無料で利用できます。 LiftKit LiftKitにはさまざまな機能がありますが、主な機能は3つ。 Material Style アイコン

    UI要素のサイズ、マージン、角丸、フォントサイズに至るまで、すべてが黄金比に基づいて設計されたUIフレームワーク -LiftKit
  • Reflective UI実践:現実世界が映り込むUI表現|usagimaru

    Reflective UIと呼ばれる表現がにわかに注目されています。そのいくつかの事例紹介や、私自身が実際に実装してみてどうだったかの所感を書き留めておこうと思います。 Reflective UIとはReflective UIとは、光や映像の反射表現を活用してUIの質感を高めた表現を指します。ジャイロや加速度センサーを使って擬似的に反射を表現したり、カメラで取り込んだ映像をUIのテクスチャとして活用して、より現実感を持たせた表現などがあります。 カメラを使う場合、例えばフロントカメラでユーザーの顔や背後の映像を撮影しリアルタイムに加工して、テクスチャとしてUIの見た目に反映します。これがスマートフォンで実装されるとまるでGUIが鏡のように映り込む質感を持った物体かのように錯覚するので、「クールな新しい表現」として注目されています。 Reflective UIに明確な分類や定義があるかは定か

    Reflective UI実践:現実世界が映り込むUI表現|usagimaru
  • ✕はなぜ閉じるのシンボルなのか歴史を読み解く|みーた

    先日Cybozu Frontend Monthly #1 にてb4h0_c4tさんの「HTMHell special: close buttons」のお話を聴いていた中で、一つ引っかかるものがあった。 「そもそも✗(バツ)は閉じるって意味じゃないから!」 確かに。 現代、様々なUIを触ってきた中でなぜ ✕ を閉じるものと捉えているのだろうと不思議に思った。 ✕ではなくx(エックス)で表現されることも多々あるようで、こんな名言もある。 ✕とはなんなんだろう ではなぜこのクロスの記号(✕)が閉じるの意味を持ってしまったのか考えてみる。 一旦✕を見て思い出すものを上げてみようと思う。 ・◯と✕(日の正誤表記) ・✓と✕(海外...主に欧米の正誤表記) ・プレステのコントローラー ・海外ゲームだと決定が✕、キャンセルが◯ ・宝の地図なんかで在り処を記す ・上記のツイートのようにx(エックス)とし

    ✕はなぜ閉じるのシンボルなのか歴史を読み解く|みーた
  • 接触確認アプリ「まもりあいJapan」において、UXとUIのデザイナーたちが大切にしたいと思っていたこと|shosira

    皆様、はじめまして。Goodpatch Anywhereの大橋と申します。Goodpatch Anywhereは2018年にスタートした、日各地にいる専門家がフルリモートで仕事をしているデザインチームです(Goodpatchというデザイン会社の事業部門のひとつです)。 私たちGoodpatch Anywhereは、Code for Japanが中心となって有志チームが開発を進めてきた、接触確認アプリ「まもりあいJapan」の設計において、ユーザーとなる皆さんが触れることになるアプリの画面デザイン、機能、通知の内容、お伝えすべき情報などについて、エンジニア、公衆衛生や感染症の専門家と連携し、関係者にお話を伺いながらデザインやユーザーテストを重ねてきました。 既報のとおり、日では今後、接触確認アプリを公的に導入することが決定されたため、チームではサンプルコードや仕様の公開を通じて、接触確

    接触確認アプリ「まもりあいJapan」において、UXとUIのデザイナーたちが大切にしたいと思っていたこと|shosira
  • UI GRAPHICS新版に寄稿しました - Appleが目指す「流れるインターフェース」|Go Ando / PREDUCTS / THE GUILD

    2015年に初版が発行された「UI GRAPHICS」は、当時の数多くのモバイルアプリの最先端のデザイン事例と共に、スマートフォン以降に生まれたUIのデザイン思想、インターフェース論について、UIの専門家達による様々な考察を掲載した、大変人気を博した書籍でした。 そして先日発売された「UI GRAPHICS」の続編「新版 UI GRAPHICS  成功事例と思想から学ぶ、これからのインターフェースデザインとUX」に大変光栄な事に、共著者の一人として参加させていただきました。 今回出版元のBNN新社様より、当方のパートをnoteに掲載する事をご許可いただいたので、前半部分に限り一部ご紹介したいと思います。 テーマはAppleの開発者向けカンファレンスWWDC 2018のセッション「Designing Fluid Interfaces」で紹介された、新たなUIデザイン思想についての考察です。

    UI GRAPHICS新版に寄稿しました - Appleが目指す「流れるインターフェース」|Go Ando / PREDUCTS / THE GUILD
  • dely.design

    This domain may be for sale!

    dely.design
  • 娯楽を超えたデザイン (UI Crunch #13 娯楽のUI イベントレポート)|のっち Ryosuke Inoue

    UI Crunch #13 娯楽のUI - by Nintendo -」に参加しました。世界的にも注目される企業かつあまり表に出てこないデザイントークが聞けると言うことで、倍率も相当なものとなっておりました。この企画は構想から2年くらいかかったそうで、とても濃いお話を聞くことができました。めちゃ感動しました。今回は、そちらのイベントレポートです。最初の方あまり写真を撮らなかったので、後半の写真が多めになります。 1人目は、UI/UX デザイン チーフの正木さん。「娯楽UIの思考の原点」についてお話いただきました。 Nintendo流の「伝え方」Nintendoが人に何かを「伝える」時にこだわっていること。それは、以下の3つです。 ・「教える」ことよりも「体験する」ことで、より早く、的確に伝えることができる。 ・初めての体験は一度きり。新鮮な印象を大切にする。 ・体験はやっぱり面白くしよう

    娯楽を超えたデザイン (UI Crunch #13 娯楽のUI イベントレポート)|のっち Ryosuke Inoue
  • 映画から想像するVR・AR時代のGUIデザイン

    ここ最近(というか数週間)、Build 2015でのMicrosoftの発表の攻めっぷりがすごかったよね。「Visual Studio Code」でクロスプラットフォーム対応したり、顔画像の年齢推定エンジンを「How Old Do I look?」で無料で試せるようにしたり。 その中でもちょっと未来的な「HoloLens」というHMDが個人的にワクワクした。 https://wired.jp/2015/05/08/new-hololens-features/ UnityがこのHoloLensに対応するそうですよ。 この手のジャンルはVRとかARとか言われたりとまちまちだけど、まあ両方の要素を含むんだろうね。 このデバイスを装着したユーザーから見ると、現実空間上で仮想オブジェクトを操作できるような感覚になる。まあ、それでもまだ触覚が無く、あくまで視覚情報の拡張なので、ユーザーインターフェイス

    映画から想像するVR・AR時代のGUIデザイン
  • 1