マガジンのカバー画像

BONO-マガジン

32
BONOを使って学んでいるnoteを集めます
運営しているクリエイター

記事一覧

デザインのつくり方/「まなぶ」は「まねぶ」のハラおち

#BONO #UIビジュアル基礎コース #ゼロからはじめるUIビジュアル #デザイン こんにちは! りんたです 今日はデザインコミュニティBONOの「UIビジュアル基礎コース」から「ゼロからはじめるUIビジュアル」で学んだことと自分の気付きをまとめます。 1.「UIデザイン」ってなに?(1)構成 UIは「コンテンツ」「ナビゲーション」「アクション」の3つの要素で構成されています。 この中で、ユーザーがいちばん求める「コンテンツ」を中心にUIができています。 この3要

BONO|UIビジュアル基礎

はじめに各TRY ごとにお題が出されます。そのお題に沿って、自分で制作→解説動画を視聴→修正をする という流れでこのコースを学びました。 TRY毎に成果物と、そこで得た学びをまとめていきます。 TRY1|コンセプトを考えてリデザインするこのレクチャーでは、以下の動画投稿サイトの自己紹介ページをリデザインするのがお題です。 いざ、取り掛かろうとさっそく”参考”を探し始めました。参考にしたのは、MENTAというWebサービスとLinkedInのWebサービスです。その結果で

Spotifyで友だちが聴いている音楽が分かる機能 - 追加お題にチャレンジしました

今回はBONOのこちらの追加お題「友だちが聴いている音楽が分かる機能を、Spotifyを初めて使う人が知れて使い始めやすくするUI」を考えました。 作成したUIのプロトタイプはこちら お題の前提前提として、ペルソナとコアコンセプトは決まっていました。 また友だちが聴いている音楽が分かる機能の画面については、動画をもとに作成しました。 目指したい形初めに、行動フローの整理から行いました。 導線としては、アプリを開いた時にグローバルナビゲーションのMy Libraryに通

【BONO】音声SNSアプリのUIデザインをしてみました!

こんにちは!めーら(@mela_dayo)です。 今回は、UIUXデザインのスキルアップのために参加しているオンラインコミュニティBONOで作成した架空の「音声SNS」の制作過程をまとめました。 はじめてのUI制作のためツッコミどころも多いと思いますが、同じようにデザインを勉強している方の参考になれば幸いです🙌🏻 【Day1】新規登録画面🌱要素・要件 新規登録者向けのEメール、パスワード登録導線がある 利用規約が確認できる 既存利用者向けのログイン導線がある い

BONO|Todoリスト Webサービス

はじめに今回は、BONOのビジュアル基本原則のレクチャー動画に基づいて作成したTodoリストのWebサービス制作過程で自身がポイントになったと思うものをまとめていきます📝 🌱制作の要件 誰がいつ使う?|1日のやることを書き出して消化するだけのタスク管理をしたい… 必要な機能|タスクの閲覧・追加・編集とカテゴリ分け BONO ビジュアル基本原則 Todoサービス その1|ヘッダーUI〜メインコンテンツヘッダーUIの作成とTodoブロックのデザイン まずは参考となるサービ

[BONO] 音声SNS UI 作ってみた

日記のような、まとめのような。つづってみましたとさ! DAY 1 : 新規登録 UI1.お題・概要 2.リサーチ Tiktokもinstagramもアカウント持っていると、新規登録画面に中々戻れないため苦戦したスクショタイム。 追加お題の参照先が⚪️×問題のようでNGパターンが分かりやすかった。 NGパターンのときのなんとも言えない違和感が面白い。 参照先を一読してからスクショした画面の中身を分析し始める。 普段何百回も目にしていたであろう見慣れた画面。似ているようで

【UIデザイン学習】構造/階層を意識して動画投稿ページを作成する

本日もUIビジュアル基礎で学んだことを書き起こしていきます。 今回もTRY(お題)があり、解説を聞きながら取り組んでいきました! #BONO のUIビジュアルというユニットで全6TRYを行い、今回が最後のお題でした。 身につけておくべき基礎情報が沢山あり、じっくり取り組んでいて3週間以上もかかってしまいました(笑)しかし、その分基本的な知識を実践しながら学ぶことができ初学者の私には良かったと思っています。 ==これまでまとめてきた事== さて、今回も実際に私が取り組ん

Daily UI - デザイン初学者のUIビジュアル強化月間

こんにちは、こんばんは。 noteの更新が少し久しぶりになりましたが、変わらずUI・UXの勉強に燃えているminamiです。 今日の記事でご紹介するのは、 デザインコミュニティBONOのロードマップで記載されている UI・UXデザイナーになるために必要とされる3つの要素  ・UIビジュアル  ・情報設計  ・UX顧客理解 の中から、UIビジュアル力を強化するために「仮想の音声SNS」を制作した過程です。 UIを勉強し始めてから、今回の制作で初めて1つの完結したサービ

【BONOログ】 コンセプトから学ぶUIビジュアル

こんにちは。KOSU(こす)です。 UI/UXデザインが学べるオンラインコミュニティ『BONO』に参加しながら、UI/UXデザインについて勉強しています。 前回の投稿に引き続き、BONO「UIビジュアル基礎 - TRY1 プロフィールUIをデザイン-」での学びについて、自分の振り返りをnoteにまとめました。 【お題】 「動画共有サービスのプロフィールUI」をリデザインしよう 制作物についてリデザインしたUI 今回私がリデザインしたUIのコンセプトとアウトプットはこち

OOUI オブジェクトの抽出方法からUI設計まで

この記事では、デザインのコミュニティBONOで学んだオブジェクト指向UI(OOUI)の概念を基に、自身の考察や他の情報源を交えたOOUIについての理解と学びを記録しています。 オブジェクトとはオブジェクトとはUIデザインの土台となるコンテンツそのものです。これはUIの中心となる要素であり、新規追加や並び替え、更新などのアクションが可能になります。 オブジェクト指向のアプローチで設計されたUIは、直感的な操作性に優れ、ユーザーにとって理解しやすいものとされています。 オブジ

【BONO】【学習記録】UIビジュアルの学びまとめ

BONOというコミュニティでUIデザインについて勉強しています💡 今回は、BONOの各シリーズでインプットした細々とした内容や、自分で調べた内容、カイくんさんにフィードバック頂いた中のUIビジュアルに関する内容をまとめていきたいと思います。 ボーダーボーダーの考え方 前提として、UI画面は様々な情報を載せて形成されている。ボーダーもそういった情報の1つである。 境界線としてボーダーを使用する目的は、他のコンテンツを引立てる、というもの。あくまで大事なのはメインのコンテン

【BONO】見た目をつくるテクニックを学ぶ ーグラフィック入門編ー

はじめまして。KOSU(こす)と申します。 現在SaaSでカスタマーサクセスとして働いており、デザイナー未経験。 業務の中で、「ユーザーにどうやって伝えれば分かりやすいんだろう?」「分かりやすい、使いやすいって何?」と考えるようになり、デザインを学ぶために1年間Webデザインスクールに通っていました。 現在はUI/UXデザインについてより学びを深めたいなと思い、約1ヶ月ほど前から『BONO』というUI/UXのオンラインコミュニティに参加しながら、UI/UXデザインについて勉

【学びログ】出張申請サービスで学ぶ、オブジェクト指向UIデザイン_BONO

こんにちは!グラフィックデザイナーからUIUXデザイナー目指し勉強中のZIN(じん)と申します。 今回は現在参加している、UIUXデザインが学べるコミュニティ“BONO-ボノ”の情報設計シリーズ『出張申請サービス』の課題制作工程と学びを共有しようと思います!皆様の創作のヒントになることがあれば幸いです。(少し長めの記事になってます💦) 課題の詳細はこちら↓↓↓ 今回の課題目的は、「要件と顧客ニーズに適合する機能のデザイン」を目指す内容でした。そのため、情報設計においてオブ

【自主制作】音声SNSアプリのUIデザイン

◾️自己紹介 初めまして、高杉と申します。既卒1年目のフリーターです。大学ではデザイン生態学を専攻し、UI / UXデザインに興味を持ちました。UI / UXデザインを学べるオンラインコミュニティ「BONO」を利用して勉強をしています。 ジャズ、コーヒー、インテリア、ガジェット、ゲーム、ジム大好きです。 ◾️本記事の目的 BONOの課題を通して、「音声SNSアプリ」の6画面のUIをデザインしました。制作物とデザインプロセスを共有するとともに、制作に意識したポイントなどを言語