やなしん

a

やなしん

a

最近の記事

  • 固定された記事

事業会社の新卒デザイナーが内定者インターンで学んだことと反省

こんにちは。株式会社ココナラで内定を頂き、2024年春の正式入社に先立ち、現在インターンとして活動しているデザイナー、やなしんと申します。来年の入社を控えていましたが、早期に実務経験を積むためにインターンとしての職務を開始し、現在に至るまで8ヶ月間、様々なプロジェクトに従事しています。この文章では、これまでの経験から得た学び、自身の成長に対する反省点、そして今後のキャリアに向けた目標について述べたいと思いま す。 自己紹介簡単な自己紹介をします! 私は大学2年生の時からW

    • Material Design コンポーネントまとめてみた Bottom sheets編

      Bottom sheets探してみた ボトムシートは、画面下部に固定されたセカンダリー・コンテンツを表示する。 □ 公式に書かれていること ⚡コンパクトサイズとミディアムサイズウインドウにボトムシートを使用 標準とモーダルの2種類 ⚡コンテンツはアプリのメインコンテンツではないこと ⚡ボトムシートがメインの画面コンテンツや機能に干渉しないように、ユーザーが必要な時に閉じたり、非表示にすることができるということを意味しています。 □ よくある使い方と特徴 Bottom

      • Material Design コンポーネントまとめてみた Search編

        Search探してみた 検索では、キーワードまたは語句を入力して関連情報を取得できます。 □ 公式に書かれていること ⚡ユーザーが入力すると、検索バーにキーワードやフレーズの候補が表示されます。 ⚡常に検索ビューに結果を表示する ⚡ユーザーは検索バーまたは検索ビューのテキスト フィールドにクエリを入力すると、関連する結果が表示されます。 *「クエリ」はユーザーが検索を求める際に入力するキーワードやフレーズ、そして「検索ビュー」はそのクエリを入力し、結果を得るためのユー

        • Material Design コンポーネントまとめてみた Radio button編

          ラジオ ボタンを使用すると、一連のオプションから 1 つのオプションを選択できます □ 公式に書かれていること ⚡リストから項目を 1 つだけ選択できる場合は、ラジオ ボタン (スイッチではなく) を使用します。 ⚡ラベルのテキストが視覚的に明確で、ユーザーが簡単に目で追いやすい ⚡選択されたアイテムは、選択されていないアイテムよりも目立ちます □ よくある使い方と特徴 ユーザーがオプションのリストから 1 つを選択できるようにするには、ラジオ ボタンを使用することを

        • 固定された記事

        事業会社の新卒デザイナーが内定者インターンで学んだことと反省

          Material Design コンポーネントまとめてみた Progress indicators編

          Navigation railをプロセスのステータスをリアルタイムで表示します □ 公式に書かれていること ⚡プロセス(ロードなど)のすべてのインスタンスに同じ進行状況インジケーターを使用する ⚡直線と円形の2種類 ⚡決して装飾として使用しないでください ⚡動きを通して注目を集める □ よくある使い方と特徴 Progress indicatorsは、アプリの読み込み、フォームの送信、更新の保存など、進行中のプロセスのステータスをユーザーに知らせます。 アプリの状態を

          Material Design コンポーネントまとめてみた Progress indicators編

          Material Design コンポーネントまとめてみた Navigation rail編

          Navigation railを使用すると、中型デバイス上の UI ビューを切り替えることができます PC Navigation rail探してみた! 使用方法□ 公式に書かれていること ⚡3 ~ 7 の遷移先とオプションの FAB を含めることができます ⚡アプリの異なる画面であっても、railは常に同じ場所に配置します □ よくある使い方と特徴 レールは、3 ~ 7 個のアプリの宛先と、オプションでフローティング アクション ボタン(FAB)を表示するサイド

          Material Design コンポーネントまとめてみた Navigation rail編

          Material Design コンポーネントまとめてみた Navigation drawer編

          Navigation drawerを使用すると、PCなどの大型デバイス上の UI ビューを切り替えることができます PC Navigation drawer探してみた! 使用方法□ 公式に書かれていること ⚡拡張レイアウトではナビゲーション ドロワーを使用し、コンパクトおよびミディアム レイアウトではモーダル ナビゲーション ドロワーを使用します ⚡デフォルトで開いたり閉じたりできます ⚡最も頻繁に使用される目的地を一番上に配置し、関連する目的地をグループ化します。

          Material Design コンポーネントまとめてみた Navigation drawer編

          Material Design コンポーネントまとめてみた Navigation bar編

          Navigation barを使用すると、デバイス上の UI ビューを切り替えることができます iOS Menus探してみた! 使用方法□ 公式に書かれていること ⚡ 同じ重要度の遷移先を 3 ~ 5 つ含めることができます ⚡目的地は変わりません。これらはアプリ画面間で一貫している必要があります。 ⚡以前はボトム ナビゲーションという名前でした □ よくある使い方と特徴 ナビゲーション バーは、アクセスしやすいように画面の下部に配置されています。各宛先はアイコン

          Material Design コンポーネントまとめてみた Navigation bar編

          Material Design コンポーネントまとめてみた Menus編

          メニューは一時的な表面に選択肢のリストを表示します iOS Menus探してみた! 使用方法□ 公式に書かれていること ⚡ メニューを使用してアイテムをスキャン可能な方法で表示する ⚡メニューを開いたり、閉じたり、選択したりしやすくする ⚡メニューは、アイコン ボタンやテキスト フィールドなどのさまざまなコンポーネントから開くことができます □ よくある使い方と特徴 メニューを使用すると、ユーザーは複数のオプションから選択できます。これらはラジオ ボタンや選択チッ

          Material Design コンポーネントまとめてみた Menus編

          Material Design コンポーネントまとめてみた Lists編

          Listsは関連するデータ群を縦方向に一列に整列させて表示するUI要素です iOS Lists探してみた! 使用方法□ 公式に書かれていること ⚡ リストを使用すると、ユーザーが特定の項目を見つけてそれに基づいて行動できるようになります ⚡リスト項目を論理的な方法 (アルファベット順や数字順など) で並べ替えます。 ⚡アイコン、テキスト、アクションを一貫した形式で表示する □ よくある使い方と特徴 リスト項目には、アイコンとテキストで表される主要なアクションと補足

          Material Design コンポーネントまとめてみた Lists編

          Material Design コンポーネントまとめてみた Divider編

          Dividerはリストまたは他のコンテナ内のコンテンツをグループ化する細い線です。 iOS Divider探してみた! 使用方法□ 公式に書かれていること ⚡ Dividerは、コンポーネントを視覚的にグループ化し、階層を作成する方法の 1 つです。ネストされた親子関係を暗示するために使用することもできます。 ⚡ディバイダには 2 つのタイプがあります。 ⚡全幅とはめ込み □Full width divider 無関係なコンテンツの大きなセクションを区切るには、全

          Material Design コンポーネントまとめてみた Divider編

          Material Design コンポーネントまとめてみた ダイアログ編

          ダイアログはユーザに特定のtaskを知らせる。重要な情報やユーザの意思決定、複数のtaskを含んでいてもよい。 iOS ダイアログ探してみた! 使用方法□ 公式に書かれていること ⚡ ダイアログを使用して、ユーザーが情報に基づいて行動できるようにする ⚡基本画面と全画面画面の 2 種類 ⚡単一のタスクを完了することに専念する必要があります ⚡タスクに関連する情報も表示できます ⚡進行状況の削除など、リスクの高いアクションを確認するためによく使用されます □ よくある

          Material Design コンポーネントまとめてみた ダイアログ編

          Material Design コンポーネントまとめてみた 日付ピッカー編

          日付ピッカーを使用すると、日付または日付の範囲を選択できます iOS 日付ピッカー探してみた! 使用方法□ 公式に書かれていること ⚡ 日付ピッカーは過去、現在、または将来の日付を表示できます ⚡現在の日や選択した日など、重要な日付を明確に示します ⚡3 つのタイプ: Docked date picker,Modal date picker,Modal date input □ よくある使い方と特徴 Docked date picker 特定の日付と年を選択でき

          Material Design コンポーネントまとめてみた 日付ピッカー編

          Material Design コンポーネントまとめてみた チップス編

          チップスは、人々が情報を入力し、選択し、コンテンツをフィルタリングし、アクションをトリガーするのに役立ちます iOS チップス種類別に探してみました アシストチップ=ホーム画面からカレンダー イベントを開くなど、複数のアプリにまたがるスマートまたは自動化されたアクションを表します。 フィルターチップ=フィルター チップは、タグまたは説明的な単語を使用してコンテンツをフィルターします 入力チップ=入力チップは、Gmail の連絡先や検索フィールド内のフィルター オプシ

          Material Design コンポーネントまとめてみた チップス編

          Material Design コンポーネントまとめてみた チェックボックス編

          チェックボックスを使用すると、ユーザーはリストから 1 つ以上の項目を選択したり、項目をオンまたはオフにしたりできます。 iOS チェックボックス探してみました! 検索を分類するときや設定の時に使用されているのが多い感じでした! 使用方法□ 公式に書かれていること ⚡ リストから複数のオプションを選択できる場合は、(スイッチやラジオ ボタンの代わりに) チェックボックスを使用します。 ⚡チェックボックスのラベルはユーザーにとってすぐに理解できるように作成されるべきであ

          Material Design コンポーネントまとめてみた チェックボックス編

          Material Design コンポーネントまとめてみた カルーセル編

          カルーセルは複数の画像などのコンテンツを左右に移動して切り替えられる。 iOS Material Designに準拠したカルーセルはあまりなかったです。なぜだろう 使用方法□ 公式に書かれていること ⚡ カルーセルは水平方向にスクロールします ⚡ 画像やビデオなどの視覚的なアイテムと、オプションのラベル テキストが含まれています。 ⚡️項目はさまざまな幅にすることができ、スクロールすると幅が変わることもあります □ よくある使い方と特徴 カルーセルには、写真のコレ

          Material Design コンポーネントまとめてみた カルーセル編