[B! UI] anpakuのブックマーク

Web制作者はブックマークしておくと便利！各UIコンポーネントのさまざまな実装方法のまとめ -The Component Gallery

Webサイトやアプリでよく使用される各UIコンポーネントのさまざまな実装方法がまとめられたThe Component Galleryを紹介します。コンポーネントは再利用可能な単一の部品として利用でき、実装するコードや名前の付け方など、Web制作者には非常に勉強になると思います。 The Component Gallery The Component Galleryの特徴 The Component Galleryの利用方法各UIコンポーネントのまとめ The Component Galleryの特徴 The Component Galleryには、実際のデザインシステムで使用されているUIコンポーネントがまとめられています。フロントエンドのデベロッパーとして毎日経験する問題を解決するために作成されました。 The Component Gallery コンポーネントや要素に名前を付けるの

anpaku 2022/11/09

勉強になります。

web
UI

リンク

よく見かけるレイアウト・UIコンポーネント、それだけを実装するHTMLとCSSのシンプルなコードのまとめ

Webページやスマホアプリでよく見かけるレイアウト、ナビゲーション、UIコンポーネントなど、それだけを実装するHTMLとCSSのシンプルなコードをまとめたCSS Layoutを紹介します。それだけを実装するため、HTMLとCSSのコードは非常にシンプル、カスタマイズも簡単だと思います。スニペットに登録しておくと、便利ですね。 CSS Layout CSS Layout -GitHub CSS Layoutの特徴レイアウトやUIコンポーネントだけを実装するコード CSS Layoutの特徴 CSS Layoutは、よく使用されるレイアウトやUIコンポーネントだけを実装するためのHTMLとCSSのコードがまとめられたコレクションです。 MITライセンスで、商用プロジェクトでも無料で利用できます。 CSS Layout 依存関係は一切無しフレームワークは必要無しピュアCSSで実装、CSS

anpaku 2021/02/19

勉強します。

リンク

全部、完全に商用利用無料！さまざまなUIデザインに適した1,064種類のSVGアイコン素材 -Emblemicons

企業サイトやプロダクトをはじめ、オンラインショップ、アプリ、プレゼン、学術プロジェクトなど、さまざまなUIデザインに適したSVGアイコンが無料で利用できるEm bl emiconsを紹介します。先日ローンチしたばかりで、アイコンの種類はなんと1,064種類！ SVGだけでなく、各サイズのPNGも揃っており、すべてオープンソースです。 Em bl emicons Em bl emicons -GitHub Em bl emiconsの特徴 Em bl emiconsのダウンロード Em bl emiconsの使い方 Em bl emiconsの特徴 Em bl emiconsは、デザイン・デベロッパー・プレゼン・学術プロジェクトなどで一般的かつ、頻繁に使用されるアイコンのオープンソースライブラリです。 MITライセンスで、個人および商用のプロジェクトで、アイコンは完全に自由に使用およびダウンロードできます。

anpaku 2020/10/02

使ってみたいですね。

リンク

説得力がグンと上がる！UIデザインの心理学

オライリーから出ている「ユーザーインターフェースデザインの心理学」から使えそうなものを実例を踏まえピックアップ！これでUIデザイン説明の説得力をあげよう！情報は一度にすべて見せるのではなく、そのとき必要なものを段階的に開示させた方がよい。デザイナーが犯しがちな失敗は一度に大量の情報をユーザーに与えてしまうことです。情報は一度に大量に与えるのではなく、その時点で必要としている情報だけを与えるほうが様々なニーズに対応することができます。ユーザーの中には大まかな説明でよい人もいれば、詳細を知りたがっている人もいます。つまりどういう事？情報は一度に見せるのではなく段階的に見せる重要なのはクリック回数ではない。クリックのたびに必要な情報が手に入るのであればユーザーは喜んでクリックする誰がいつ何を必要としているかを理解する。各段階で何を必要としているか的確に把握していないと、この手法は

anpaku 2014/05/22

リンク

見ないと損する便利なデザイナー向けWebサービス13選 | SONICMOOV LAB

こんにちは。緑のにおいが気持ち良い季節になってきましたね。3月4月は花粉で涙をボロボロ流しながら生活していたのですが、やっと思う存分散歩ができそうです。さっそくですが、デザイナー・クリエイターのみなさんは、自分の作品やスキルをアピールするために普段どのようなツールを使っているでしょうか？現在さまざまなWebサービスが出ており、うまく利用できれば活動や交流の幅が広がるはず！そう思って今回はクリエイター向けのサービスをいくつかまとめました。目次 UIアニメーションのヒントにちょっとしたアニメーションを作るときに参考にしています。動きを眺めるだけでも面白く、インスピレーションがわきます。 CAPPTIVATE.co iPhoneアプリのUIアニメーションをカテゴリ別に紹介しています。マウスオンでアニメーションが確認でき、アプリのデザインやUIアニメーションなど、アプリ開発に大変役立ち