エンジニアの副業は週1からでも可能?副業の例や探し方も解説
- ITエンジニア
- 副業
Google社は、技術、科学、デザインの概念に基づいた新しいUX体系およびデザイン概念を開発しました。その名も、「マテリアルデザイン」です。Google Nowで初めて登場した「カード」風のUXをベースに、グリッド型のレイアウトや、アニメーション、ボタンの影などを規定しました。Googleの全プラットフォームにおけるUX体系を統一するために作られたガイドラインです。
Google社のPolymer をはじめ、マテリアルデザインのCSS/JSフレームワークも数多く開発されています。
目次
Polymerとは、Google社が開発したJavascriptライブラリです。Webコンポーネント(WEBにおける、カプセル化された独自のHTMLタグを作成するためのAPI)というJavascriptの素材が使用されていて、マテリアルデザイン的なコンポーネントを簡単に入手できます。開発スピードも改善されており、未経験者でも使いこなせるプログラミング言語です。
マテリアルデザインに基づいたデザインが簡単に作れるCSSフレームワークです。レスポンシブ用の素材やSASSにも対応しているため、ユーザーが使っている端末によってUIをカスタマイズできます。モバイルを重視したプロジェクトに向いているフレームワークです。
HTML、CSS、JavascriptのフレームワークであるMUIは、立ち上がりが早く、開発者にとって使いやすいのが特徴。他のマテリアルデザインに比べ多くのWEBコンポーネントも導入されているため、幅広く対応できます。
CSSフレームワークに加え、リアクトのコンポーネントにもマテリアルデザインが導入されているmaterial ui。リアクトとは、インタラクティブなUIでよく使われているJavascriptライブラリです。
AngularJSとマテリアルデザインの初フロントエンドフレームワークであるLumX。SassとAngularJS素材によってCSSのフレームワークが構築されています。LumXのためにカスタマイズされたJQueryの機能性もあり、自動的にGulpと連携し、アプリケーションが最適化されます。
Angular.jsにマテリアルデザインを導入しようとしているAngular Material。フォーム作成とカスタマイズで幅広く対応可能のガイドラインです。WEB、タブレット端末、モバイルにも対応が最適化されたコンポーネントも重視しています。Polymerのペイパー風のコンポーネントと同じく、Angular MaterialもGoogle社が提供してくれるガイドラインに基づいています。
ティム・ニュエン氏が開発した、シンプルでレスポンス性のあるCSSフレームワークです。Material Frameworkを使用すると、どんなサイトやアプリにもマテリアルデザインを導入できます。シンプルなフレームワークであるため、初心者にも使いやすいです。
Material Design for Bootstrapは、HTML、CSS、JavascriptをベースにしているWEB開発におけるフロントエンドフレームワーク・Bookstrapに、マテリアルデザインの概念を導入しています。アプリ作成やモバイル重視のプロジェクトで使われているフレームワークとなります。本開発の前に、アイデアを試せることも可能です。Material Design for Bookstrapが、Bootstrap 4にも対応しています。
Framaterial Frameworkは、オープンソースのJavascriptライブラリによる、マテリアルデザインのフレームワークです。Framaterial Frameworkに含まれているJavascriptのコンポーネントが非常に多いため、他のリソースなしでアプリおよびサイトを開発できます。
マティリアル・デザインのもとに開発されているCSSフレームワーク。Crowというグリッド型がシステムに導入されているため、簡単にグリッドの長さや、各セルの順番などを自由に操られます。
(翻訳:Jordan Colston)