ボタン編1ライセススタッフが書くブログ。Web制作のことTwitterfacebookGoogle+はてブpocketLINEこんにちは。webデザイナーの鈴木です。今年後期の目標はUIデザインに力を入れることです。様々なシチュエーションに応じてデザイン設計行っていこうと考えています。メモメモ「良いUIデザインを作るにはどうしたらいいのか」と考え際に、普段から閲覧しているサイトに「これはいい!」と感じたパーツやレイアウトを分析してみました。interface)の略称です。意味:直訳しますとユーザーは利用者、インターフェースは接点、両者間の境界面。人間とコンピューターの間での情報をやりとりするためのデザインを示してます。WEBサイト内でいうとボタンのデザイン・メニューの開き方などなど...PCで操作する際に使うキーボード・マウスもハードウェアにおけるUIになります。ユーザーがサイトに訪れた際に快適に閲覧やサービスを利用できる様に設計するのがUIデザインです。達成目標のイメージがこんな感じですねLv5:スムーズに使えるようする。多少考えてしまうがサービス利用に関して影響ないレベル。Chromeがリリース10周年を迎えまして、リリース記念に大幅にUIデザインが更新されてました。丸みの帯びたデザインになり、個人的に感じたのは白く薄くなって柔らかく、主張の激しくないデザインとなったと感じました。(初期設定のテーマ)。売上100万円??!!最安49800円のLINEスタンプ製作!!やっと本題です。(゚ー゚;ゴルフ場予約サイト:楽天GORAWebサイト基本的な構造Webサイト基本的な構造が大体以下画像のようなっています。様々なパーツをシチュエーションに合わせて設計していきます。今回は【ボタンリンク】について分析してみました。【ボタンリンク】の部分は人がアクションを起こす際に使われる重要な部分ですのでちゃんと設計していく必要となってきます。格安イラスト制作ならEagleGraohics(イーグルグラフィクス)デザインの流れスキュアモーフィックデザインからフラットデザインやマテリアルデザインが主流になった今、文字を四角いアウトラインで囲っただけのシンプルなデザイン表現が浸透して来ましたが、やはり一定のリテラシーは必要となってきます。様々なサイトから集めた「一覧へ」のボタン上記画像は様々なサイトから集めた「一覧へ」のボタンです。アイコン最近はこのタイプをよく見かけますね。外箱(ボタン領域のデザイン)アイコンを使わないデザインの中で、一番右のハンバーガーメニューのアイコンを使っている一覧ボタンのデザインはWeb慣れしている方でしたらわかりやすいと感じました。クリックした後になにがあるのかがイメージしやすいと感じました。真ん中と右のボタンも捲ったら又は下にまだあるとイメージさせられるデザインになっているので、アイコンとは違ったデザインの表現がでるのでサイトの雰囲気を統一する際には良い参考になると思いました。アイコンを前後どちらに配置するのも受ける印象が変わります。今回紹介したのは「一覧」ボタンですので、デザインのバリエーションはあまり多くないと感じますが、これらのボタンはcssで構築可能なという縛りで集めたもになります。アイコンにはまだまだまとめたい部分がありますので、また次回のブログにまとめます。模索している段階ですので、更新頻度は高くないですが今後も参考集めをやって行きたいと考えています。今後のWEBデザインの参考に繋がるものにしたいと思います。繁体字フォントWebを作るのは人。INFORMATIONraisez(ライセス)に興味を持った方は、是非チェックをしてください。NEWS2019/4/3納品情報:ミラクルサッカースクール様2019/2/1納品情報:DISIT様NEWS一覧RECOMMENDEDWebを楽しむのは人。CONTACTWeb制作、Webビジネスのご相談はお気軽にご連絡ください。Reserved.お問い合わせTOPへ戻る。