絞り込み条件を変更する
検索条件を絞り込む

すべてのカテゴリ

35 件中 1 - 35 件表示
カバー画像

CSSでデザインを再現する難しさと楽しさ

本日は、現在制作中のホームページでHTML・CSSの調整を行いました今回はデザインカンプを見ながら、カードデザインの細かな部分を再現していく作業です。「ここを数px動かすだけで印象が変わる」そんなデザインの奥深さを改めて感じた一日でした。アイコンの位置を微調整今回一番時間をかけたのは、アイコンの配置です。画像を差し替えたことで位置のバランスが変わり、CSSで* `position`* `left`* `top`* `justify-self`などを使いながら、デザインカンプに近づけていきました。数pxの違いでも見た目の印象が大きく変わることを実感しました。リボンデザインもCSSだけで実装カード左上のリボンは、画像ではなくCSSだけで作成しました。特に印象に残ったのが、擬似要素(`::after`)を使ってリボンの先端を作る方法です。今までは画像で作るものだと思っていましたが、CSSだけでもここまで表現できることに驚きました。デザインカンプとの比較コーディングでは「動けばOK」ではなく、デザインカンプを見ながら* アイコンのサイズ* タイトルとの距離* 余白* 線の位置などを何度も見比べて調整しました。細かい作業ではありますが、この積み重ねが完成度につながるのだと感じています。--- 学んだことHTMLやCSSはコードを書くだけではなく、「どう見せるか」を考えることも大切だと改めて感じました。デザインを忠実に再現するためには、1px、2px単位の調整を繰り返すことも少なくありません。少しずつですが、自分でもデザインカンプとの差を見つけられるようになってきたことが今日一番の成長です
0
カバー画像

色のユニバーサルデザインについて学習しました!

色のユニバーサルデザインとは?「ユニバーサル(Universal)」には、「普遍的な」「すべての人に共通する」という意味があります。色のユニバーサルデザインとは、色覚の多様性を考慮し、できるだけ多くの人に正しく情報が伝わるように配色やデザインを行う考え方です。色覚特性とは?色の識別に関わる個性のことを色覚特性と呼びます。私たちは普段、「目立たせたいから赤色を使おう」と考えがちですが、すべての人にとって赤色が目立つとは限りません。見る人によって色の見え方には違いがあるため、色だけで情報を伝えない工夫が大切になります。遺伝による色覚特性遺伝によって特定の色を区別しづらい色覚特性を持つ人は少なくありません。日本国内では約300万人以上いるとされており、決して珍しいことではありません。また、人種によって割合は異なり、白人男性では約6〜8%とされています。なぜ色の区別が難しくなるの?私たちの目には、L錐体(赤系)M錐体(緑系)S錐体(青系)の3種類の錐体があります。遺伝による色覚特性では、このうち1つ以上の錐体が存在しない、または正常に機能しない場合があります。そのため、多くの人には異なる色として見える色同士が、似た色に見えて区別しづらくなるのです。学んだことホームページや資料を作成するときは、🔴「赤だから目立つ」🟢「緑だからわかりやすい」と決めつけるのではなく、文字を入れるアイコンを使うコントラストを確保するなど、色だけに頼らない工夫も大切だと感じました。より多くの人に伝わるデザインを目指したいですね✨本日はここまで!
0
カバー画像

【本日の学習記録】インテリアと心理効果・視覚効果について学びました!

今日は色彩検定の学習で、インテリアにおける色の心理効果・視覚効果について学びました。色には「好き・嫌い」だけでなく、人の感じ方や空間の広さ、温度感まで変える力があります。Webデザインでも配色はとても重要なので、今後の制作にも活かせそうな内容でした!🌞 暖色・寒色色には暖かさや涼しさを感じさせる効果があります。🔶 暖色赤オレンジ黄色→ 温かい・活発・親しみやすい印象🔷 寒色青水色青緑→ 涼しい・落ち着いた・清潔感のある印象最近ではLED照明でも光の色を変えることで、暖色・寒色を演出できます。ただし、寒い部屋に暖色暑い部屋に寒色を使う場合は、壁全体など広い面積ではなく、小物や照明など部分的に取り入れる方が自然だと学びました。🎨 進出色・後退色色には距離感を変える効果もあります。🔴 進出色→ 手前にあるように感じる色🔵 後退色→ 奥にあるように感じる色例えば、部屋の奥側の壁に後退色を使うと奥行きを感じ、反対に進出色を使うと壁が近く感じられます。限られた空間でも、色の使い方次第で広さの印象が変わることを知りました。🏠 膨張色・収縮色明るさによって空間の広さも変わって見えます。☀️ 高明度色(明るい色)→ 空間が広く感じる🌑 低明度色(暗い色)→ 空間が引き締まり、狭く感じるそのため、床・壁・天井を明るい色でまとめると、開放感のある空間になります。⚖️ 軽い色・重い色色には「軽さ」「重さ」の印象もあります。これは明度によって決まります。🌿 高明度→ 軽快・爽やか🌳 低明度→ 重厚・落ち着いた印象また、天井 → 壁 → 床の順に少しずつ暗くすると、自然で安定感のある空間になります。逆に、
0
カバー画像

CSSだけでリボンデザインを作成しました!

本日は、Web制作でカードデザインに使用するリボン装飾をCSSだけで作成しました。一見シンプルなデザインですが、実際に作ってみると「こんな表現もCSSだけでできるんだ!」という発見がたくさんありました。---リボン本体を作るまずは長方形のリボン本体を作成しました。```css.reason-ribbon {  position: absolute;  top: -2px;  left: 12px;  width: 24px;  height: 30px;  background: var(--gold);}```カードの左上に配置し、背景色を設定することでリボンのベース部分が完成します。ここまでは比較的シンプルなコードです。---ポイントは擬似要素!今回一番勉強になったのが、この部分です。```css.reason-ribbon::after {  content: "";  position: absolute;  left: 0;  bottom: -7px;  border-left: 12px solid var(--gold);  border-right: 12px solid var(--gold);  border-bottom: 7px solid transparent;}```最初は「三角形の画像を使うのかな?」と思っていましたが、実は**border**だけで作られています。左右のborderに色を付け、下側だけ透明にすることで、リボンの先端がV字にカットされたような形を表現できます。画像を使わずにここまで表現できることに驚きました!CSSだけで装飾が作
0
カバー画像

WordPressのPHPに挑戦しました!

本日はホームページ制作で、HTMLサイトをWordPress化するためのPHP編集を進めました。これまではHTMLやCSSを中心に触ることが多かったのですが、今回はWordPress特有のPHPコードを扱う機会がたくさんありました。特に苦戦したのは、投稿一覧や記事ページの表示部分です。ニュース一覧を表示するために、* get_posts()* foreach* setup_postdata()などを使用しながら、投稿データを取得して表示する仕組みを学習しました。また、* アイキャッチ画像の表示* カテゴリー表示* 投稿日の表示* 記事タイトルの表示などもPHPで動的に表示できるよう調整しました。---WordPressはHTMLだけでは作れない静的なHTMLサイトであれば、一つひとつ手作業で更新する必要があります。しかしWordPressでは、投稿を追加するだけで一覧ページや詳細ページに自動で反映されます。その仕組みを支えているのがPHPです。実際に触ってみると、「なぜこのコードで動くの?」と思う部分も多く、まだまだ勉強が必要だと感じました。---少しずつ理解できるようになってきた最初はエラーが出るたびに焦っていましたが、* PHPの記述場所* WordPress独自関数* ループ処理など、少しずつ理解できるようになってきました。デザインだけでなく、WordPressの仕組みも学びながら制作を進めています。本日はここまで!【before】(HTML)<h2>NEWS</h2><div class="news-item">  タイトル</
0
カバー画像

【色彩検定】インテリアデザインは何から考える?前提条件を学びました!

こんにちは!本日は色彩検定の学習を進め、その中で**「インテリアデザイン」**について学びました。インテリアというと、家具やカーテン、照明などを選ぶイメージがありますが、実際は見た目だけで決めるものではありません。まずは、その空間の前提条件を整理することが大切だと知りました。インテリアデザインの基本的な流れインテリアデザインは、次のような順番で考えます。① 前提条件(環境・建築・人)を把握する⬇️② 条件を踏まえてインテリアエレメント(家具・照明・色・素材など)を計画するデザインから考えるのではなく、まず条件を知ることが重要なんですね。インテリアデザインの3つの前提条件🌿 環境要因建物を取り巻く環境を確認します。立地条件関連法令敷地条件日照条件眺望日当たりや景色によって、色の見え方や部屋の印象も大きく変わります。🏠 建築要因建物そのものの特徴を把握します。戸建住宅・集合住宅構造・工法各部屋の配置窓や開口部の位置扉・建具室内の素材や仕上げ建築設備家具の配置や照明計画にも大きく関わる重要な要素です。👨‍👩‍👧 人的要因実際に暮らす人に合わせた設計も欠かせません。家族構成年齢ライフスタイル好みインテリアへの要望予算どんなにおしゃれでも、使いやすくなければ意味がありません。利用する人に合わせてデザインすることが大切だと学びました。今日の学び今回学習して感じたのは、インテリアデザインは「センス」だけではなく、環境・建物・人を総合的に考えて設計する仕事だということです。Webデザインでも、ユーザーや目的を考えて制作することが重要なので、インテリアデザインとの共通点を感じました。これからも色
0
カバー画像

PHPで投稿情報を取得!NEWSカードを作成しました

WordPress化でNEWS一覧を作成しました!本日はWordPress化の作業を進めました。ニュース一覧を動的に表示するためのPHPコードを学習しながら、NEWSカードの作成を行いました。---#投稿情報を自動で取得今回作成したNEWSカードでは、(デザインを少し変えました)WordPressに投稿した記事の* アイキャッチ画像* 投稿日* カテゴリー* 記事タイトルを自動で取得して表示しています。例えば、```phpthe_post_thumbnail();```でアイキャッチ画像を表示し、```phpthe_title();```で記事タイトルを表示できます。---カテゴリーの取得に苦戦今回特に印象に残ったのはカテゴリー表示です。```php$categories = get_the_category();```でカテゴリー情報を取得し、```phpwp_list_pluck()```や```phpimplode()```を使って複数カテゴリーを表示しました。コードの意味を理解するのに少し時間がかかりましたが、「投稿情報を取得する → 必要な情報を取り出す → 表示する」という流れが少しずつ理解できてきました。--- HTMLとの違いHTMLだけの場合は、ニュースを追加するたびに手作業で更新する必要があります。しかしWordPressでは、投稿するだけで一覧ページに自動反映されます。実際にコードを書いてみることで、WordPressがどのように情報を管理しているのか学ぶことができました。学んだこと最初はPHPを見るだけで難しく感じていましたが、実際に* the_perm
0
カバー画像

光はどう脳へ届く?👀 目の仕組みを学習しました!

本日のブログは、色彩検定の学習内容から「目の構造」についてまとめていきます👀✨私たちは普段、当たり前のように景色を見ていますが、実は目の中ではとても複雑な働きが行われています。まず、目に入った光は最初に「角膜」で屈折します。その後、「虹彩」が伸び縮みすることで瞳孔の大きさを変え、目に入る光の量を調整しています。さらに、「水晶体」というレンズの役割を持つ部分が光を屈折させることで、見たものの像を「網膜」に結びます。つまり、目に入った光は・角膜・水晶体この2箇所で屈折しているということですね✨また、水晶体は見る距離によって厚みが変化します。・近くを見る時 → 厚くなる・遠くを見る時 → 薄くなるこのピント調整を行っているのが、毛様体の基部にある「毛様体筋」です👀そして、水晶体によって網膜に結ばれた像の情報は、「視細胞」と呼ばれる細胞によって神経信号へ変換されます。視細胞には2種類あり、・錐体細胞→ 色や明るさを感じる・かん体細胞→ 暗い場所で働くという特徴があります✨変換された信号は、神経節細胞を経て「視神経」に伝わり、最終的に脳へ送られることで、私たちは“見る”ことができています。普段何気なく行っている「見る」という行動も、実はたくさんの器官や細胞が連携して成り立っているんですね☺️色彩検定では、色だけではなく光や視覚の仕組みまで学べるので、Web制作やデザインにも活かせそうだなと感じました✨
0
カバー画像

HIDランプと白色LEDについて学習しました💡

本日は色彩検定の学習で、「HIDランプ」と「白色LED」について学びました💡照明にはさまざまな種類があり、使われる場所や光の特徴がそれぞれ違うことを知りました✨■ メタルハライドランプ高効率で演色性が良く、とても明るい光を出せるランプです。スポーツ施設や商業施設など、広い空間を明るく照らしたい場所で使われています🏟️また、色温度の種類も豊富で、自然で綺麗な色に見せやすい特徴があります。■ 水銀ランプ道路や公園、倉庫などの照明として使われてきたランプです。白熱電球よりも効率が高く、約3倍の発光効率を持っているそうです💡ただ現在は、より効率や演色性に優れたメタルハライドランプやLEDの普及によって、使用される場面が少なくなってきています。■ 高圧ナトリウムランプ温かみのあるオレンジ色の光が特徴のランプです✨道路照明やスポーツ施設、景観照明などに使われ、ホテルロビーなどで採用されることもあったそうです。白熱電球に近い暖かい雰囲気を作れるのが特徴です☺️■ 低圧ナトリウムランプオレンジ色の強い光を持つランプで、開発当初は非常に高効率だったそうです。道路やトンネル照明として広く使われていましたが、色の見え方(演色性)が悪いため、現在は他の照明へ置き換えが進んでいます🚗■ 白色LED1993年に高輝度青色LEDが実用化され、赤・緑・青の「光の三原色」が揃ったことでLED照明が大きく普及したそうです✨現在では、・寿命が長い・省エネ・光色が豊富・赤外線や紫外線をほとんど出さないなど多くのメリットがあり、照明の主流になっています💡最近ではHIDランプの代わりにLEDが採用される場面も増えていると
0
カバー画像

色相環の分割による配色について学習しました!

本日の色彩検定の学習では、「色相環の分割による配色」について勉強しました。前回学習した色彩調和の理論では、「なぜ色が調和して見えるのか」を学びましたが、今回は実際に色相環をどのように分割して配色を作るのかを学習しました。デザインをしていると、「色を増やしたいけど、まとまりがなくなってしまう」ということがあります。そんな時に役立つのが今回の内容です。ダイアード(2色配色)ダイアードは、色相環で補色関係にある2色を使う配色です。例えば、赤 × 緑青 × オレンジなどがあります。コントラストが強く、印象的なデザインを作ることができます。スプリットコンプリメンタリー(分裂補色配色)補色関係にある色を直接使わず、その両隣の色を組み合わせる3色配色です。補色ほど強い対比にならず、程よいコントラストと調和を両立できるのが特徴です。配色に少し変化をつけたい時に活躍しそうです。トライアド(3色配色)色相環を3等分し、正三角形になる位置の色を選ぶ配色です。色のバランスが良く、カラフルなのにまとまりを感じやすい配色としてよく知られています。テトラード(4色配色)色相環を4等分し、正方形になるように色を選ぶ配色です。使える色数が増えるため、デザインの表現の幅も広がります。ただし色数が増える分、主役となる色を決めることが大切だと感じました。ペンタード(5色配色)色相環を5等分して作る配色です。5色を使うため非常に華やかですが、統一感を保つ工夫も必要になります。ヘクサード(6色配色)色相環を6等分して作る配色です。かなり多くの色を使用するため、イベントデザインやポップな表現に向いていそうだと感じました。学
0
カバー画像

色彩調和の考え方について学習しました!

本日の色彩検定の学習では、「色彩調和の考え方」について勉強しました。デザインをしていると、「なぜこの配色はまとまって見えるのだろう?」「なぜこの色の組み合わせは違和感がないのだろう?」と思うことがあります。その答えのヒントになるのが、色彩調和の理論です。色彩調和とは?色彩調和とは、「複数の色を組み合わせたときに心地よく感じる状態」のことです。今回は、アメリカの色彩学者ジャッドが提唱した「4つの原理」を学習しました。① 秩序の原理規則的に配置された色の中から、規則的に選んだ色同士は調和するという考え方です。例えば、色相環で等間隔に色を選ぶ配色などがこれに当たります。規則性があることで、まとまりや安定感を感じやすくなります。② 馴染みの原理私たちが日常生活の中で見慣れている色の組み合わせは調和して感じられるという考え方です。例えば、* 空と雲* 森や草木* 土や木材など自然界に存在する配色です。ナチュラルなデザインが落ち着いて見える理由の一つですね。 ③ 類似性の原理共通点を持つ色同士は調和するという考え方です。例えば、* 同じ色相* 同じトーン* 似た明度などです。Webサイトでも同系色でまとめると統一感が出るのは、この原理が関係しています。④ 明瞭性の原理明確なコントラストを持つ色同士も調和するという考え方です。例えば、* 白と黒* 青と赤* トリコロール配色などです。コントラストがはっきりしていることで、力強く印象的なデザインになります。学んだこと今回学習して感じたのは、調和する配色には「理由」があるということです。今までは感覚で色を選ぶことも多かったのですが、* 規則性があ
0
カバー画像

色はどうやって見えている?三色説と反対色説を学習しました!

三色説と反対色説について学習しました!本日の色彩検定の学習では、三色説と反対色説について勉強しました。三色説三色説は、イギリスの医師であるヤングが提唱した考え方です。ヤングは、「目の中には3種類の光を感じる粒がある」という仮説を立てました。この3種類の粒は、それぞれ異なる光に反応し、その組み合わせによって色を知覚すると考えました。その後、ドイツの生理学者・物理学者であるヘルムホルツがこの考えを発展させます。ヘルムホルツは、目に入った光が赤(R)緑(G)青(B)に反応する3種類の視細胞によって受け取られると考え、これを理論化して三色説としました。現在のL錐体・M錐体・S錐体の考え方にもつながっています。反対色説しかし三色説だけでは説明できない現象もあります。例えば、黄色は赤と緑の視細胞の反応によって知覚されることになりますが、私たちは黄色を見ても、「赤っぽい黄色」や「緑っぽい黄色」として感じるわけではありません。また、青緑色をしばらく見た後に赤色の残像が見える補色残像も三色説だけでは説明できませんでした。ヘリングの反対色説そこでドイツの生理学者・心理学者であるヘリングは、目の中には反対の色に対して異なる反応を示す仕組みがあると考えました。これが反対色説です。ヘリングは、赤 ⇔ 緑黄 ⇔ 青白 ⇔ 黒という3組の反対色を仮定しました。このうち色味を持つ原色は赤緑黄青の4色なので、四原色説とも呼ばれます。反対色説で説明できること反対色説では、赤と緑は同時に存在できず、黄と青も同時に存在できません。そのため、緑みの赤青みの黄色という色が存在しない理由を説明できます。また、青緑を見続けた
0
カバー画像

店舗情報セクション制作と色によるユニバーサルデザイン

本日はホームページ制作で、店舗情報セクションのデザイン制作を進めました!店舗の所在地や営業時間、アクセス方法などを分かりやすく整理しながら、見やすさも意識してレイアウトを調整しています。ホームページでは、必要な情報を探しやすいことも大切です。特に店舗情報は来店を検討している方が確認することが多いため、視認性や導線を意識しながら制作を進めました。色によるユニバーサルデザイン本日の色彩検定では、色によるユニバーサルデザインについて学習しました。 ① 見分けやすい色使い区別したい色は、明度差を大きくしたり色相を調整したりすることが重要です。また、色覚特性の違いによって区別しづらい色の組み合わせは避ける必要があります。例えば、* 青 × 黒* 黄 × 白のように明度差が小さい配色は見分けにくくなります。さらに、色相・明度・彩度が近い色同士を使用する場合は、間に境界線(セパレーション)を入れることで見分けやすくなります。--- ② 色以外の要素を活用する色だけで情報を伝えようとせず、* 大きさを変える* 形を変える* 模様を入れるなどの工夫も有効です。色を塗る部分にパターンを加えることで、色覚特性のある方にも情報が伝わりやすくなります。--- ③ 言葉で補う色付けした部分には、色名や説明文を併記することも大切です。色だけに頼らず、文字でも情報を伝えることで、より多くの人に伝わるデザインになります。---ホームページ制作でも、「自分には見やすい」ではなく、「できるだけ多くの人に伝わるか」という視点を持つことが大切だと感じました。本日はここまで!
0
カバー画像

ファッションの色彩について学習しました!

本日の色彩検定の学習では、「ファッションの色彩」について勉強しました。普段学習している色彩学では、色相・明度・彩度などを中心に色そのものを考えることが多いですが、ファッションの世界では少し考え方が異なります。今日はその違いについて学びました。ファッションでは色だけで印象が決まるわけではない色彩学では、赤は暖かいイメージ、青は冷たいイメージ、というように色そのものの印象を学びます。しかしファッションでは、素材やデザインによって印象が大きく変わります。例えば、艶のあるエナメル素材で作られた赤いコート。赤には暖かさや情熱的なイメージがありますが、エナメル素材になることでクールでスタイリッシュな印象が強くなります。反対に、青系のモヘアニットは寒色なのに暖かそうに感じます。これは色ではなく、素材が持つふわふわした印象が影響しているからです。素材によって見え方も変わるファッションでは素材の凹凸や光沢によって、陰影が強く見えることがあります。同じ色でも、マットな素材と光沢のある素材では全く違う印象になります。色だけではなく、素材との組み合わせも重要だと感じました。離れて見ると色が変わって見える洋服は実際に着用して少し離れた距離から見られることが多いため、同化や混色が起こりやすいという特徴があります。近くで見た時と遠くで見た時で印象が変わることもあるため、コーディネート全体で色を考えることが大切です。ファッションの基本カラーコーディネートファッションでは、ベースカラーアソートカラーアクセントカラーの3つを基本として考えます。これはWebデザインやグラフィックデザインでもよく使われる考え方ですね
0
カバー画像

色の三属性とイメージについて学習しました!

本日の色彩検定の学習では、「色の三属性とイメージ」について勉強しました。色彩検定を勉強していると、「色相・明度・彩度」という言葉がよく出てきますが、実はこれらは単なる知識ではなく、デザインで相手に与える印象をコントロールするための大切な要素です。色相が与えるイメージ暖色系の色は暖かく、寒色系の色は冷たいイメージを与えます。また、暖色系の高彩度色は興奮感や活発な印象、寒色系の低彩度色は落ち着きや沈静感を与えます。例えば、飲食店の広告で赤やオレンジが多く使われるのも、暖かさや活気を感じてもらうためです。明度が与えるイメージ高明度色は軽く柔らかい印象、低明度色は重く硬い印象を与えます。最近よく見かけるナチュラル系のWebサイトは、白やベージュなど高明度色を使うことで優しい雰囲気を作っていることが多いですね。反対に、高級感のあるサイトでは黒や濃いネイビーなど低明度色がよく使われています。彩度が与えるイメージ高彩度色は派手で目立つ印象、低彩度色は落ち着いた印象を与えます。つい「目立たせたいから鮮やかな色を使おう」と考えてしまいますが、使いすぎると見づらくなってしまうこともあります。だからこそ、ベースカラーは低彩度、アクセントカラーだけ高彩度にするなどの工夫が大切なんですね。学んだことデザインを始めた頃は、「なんとなくこの色が好き」で色を選んでいました。でも色彩検定を勉強していると、「なぜこの色を使うのか」を説明できるようになってきます。デザインはセンスだけではなく、理論で考えられる部分もたくさんあるんだなと改めて感じました。駆け出しのデザイナーさんほど、色彩の知識はきっと武器になると思い
0
カバー画像

グラデーションについて学習しました!

グラデーションとは?グラデーションとは、色を段階的(リズミカル)に変化させながら配列する多色配色のことです。色の類似性による統一感と、対照性による変化のバランスが良く、調和しやすい配色方法として知られています。ホームページや広告、イラストなどでもよく使われています。色相のグラデーション色相を少しずつ変化させるグラデーションです。高彩度のトーンを使用し、隣り合う色同士の色相差を1〜3の範囲にすると、自然で美しいグラデーションになります。例🟢 → 🟩 → 🟨 → 🟧 → 🟥明度のグラデーション明るさを段階的に変化させるグラデーションです。トーン区分図では縦方向の関係になります。明度のグラデーションは無彩色でも作ることができます。例⬛ → ◼ → ◾ → ◽ → ⬜明度・彩度のグラデーション明度と彩度を同時に変化させるグラデーションです。例えば、右から左へ進むにつれて明度が高くなる彩度が低くなるという変化をつけることができます。PCCSでは、純色 → 明清色の順に並べると効果的なグラデーションになります。学んだことグラデーションは単純に色を並べるだけではなく、色相明度彩度のどの要素を変化させるかによって印象が大きく変わることを学びました。Webデザインでも背景やボタンなどで使われることが多く、配色の知識としてしっかり覚えておきたいと思います。本日はここまで!
0
カバー画像

配色テクニックについて学習しました!

本日の色彩検定の学習では、配色テクニックについて勉強しました。ホームページやチラシなどのデザインでは、色を選ぶだけでなく、どのような役割で使うかも重要になります。今回は「アクセントカラー」と「セパレーション」について学習しました。---アクセントカラーアクセントカラーとは、配色全体を引き締めるために、目立つ色を小さな面積で使用することです。全体の色に対して、色相やトーンが大きく異なる色を選ぶことで視線を集める効果があります。---ベースカラー(基調色)配色の中で最も面積が大きい色です。ホームページでいうと背景色などが該当します。---アソートカラー(配合色)ベースカラーの次に面積が大きい色です。ベースカラーと組み合わせて全体の雰囲気を作ります。---アクセントカラー(強調色)配色の中で最も面積が小さく、最も目立つ色です。ボタンや重要なお知らせなど、注目してほしい部分によく使われます。---セパレーションセパレーションとは、色と色の境界部分に別の色を加えて色を分離するテクニックです。---セパレーションを使う場面* 鮮やかな色同士で対比が強すぎるとき* 明度差が少なく境界が分かりにくいとき---セパレーションの効果色と色の間に、背景に対して明度差のある色を線として入れることで、境界がはっきりし、見やすくなります。ホームページ制作でも、ボタンやカードデザイン、見出しなどでよく活用される考え方です。---学んだこと配色は色を選ぶだけではなく、* ベースカラー* アソートカラー* アクセントカラーという役割を意識することが大切だと学びました。また、セパレーションを使うことで、より見やす
0
カバー画像

色覚特性と加齢による色の見え方について学習しました!

本日の色彩検定の学習では、「色覚特性」と「加齢による色覚変化」について勉強しました。日本眼科学会の学術用語では「色覚異常」という言葉が使われています。色覚異常は、L錐体・M錐体・S錐体のうち、どの錐体が正常に機能していないかによって大きく3つに分類されます。しかし一般的には、「異常」という表現ではなく、**色の見え方の個性**という意味で「色覚特性」という言葉が使われることも知っておきましょう。---## 加齢による色覚変化色覚特性は遺伝だけでなく、加齢によっても変化します。年齢を重ねると、暗い場所で物が見えづらくなることがあります。これは視細胞の感度が低下することが原因とされています。また、色の見え方に関わる変化として、次の3つの言葉を理解しておくことが大切です。--- ① 水晶体の黄変加齢により水晶体が少しずつ黄色く変化していく現象です。その結果、青系の光が通りにくくなり、若い頃と比べて色の見え方が変化することがあります。--- ② 白内障水晶体が濁る病気です。視界がかすんだり、まぶしさを感じやすくなったりする原因となります。色の見え方にも影響を与えることがあります。---③ 視野欠損目の病気などによって、視野の一部が見えなくなる状態です。自分では気付きにくい場合もありますが、日常生活や色の認識にも影響を与えることがあります。---## 学んだこと色の見え方は人によって異なり、遺伝だけでなく加齢や病気によっても変化します。ホームページ制作や資料作成を行う際は、「自分には見やすい」ではなく、「できるだけ多くの人に伝わるか」という視点を持つことが大切だと感じました。本日はここま
0
カバー画像

白熱電球でも白い紙は白く見える?色順応と色の恒常性について学習しました!

本日の色彩検定の学習では、「色順応」と「色の恒常性」について勉強しました。色順応とは?例えば、白熱電球で照らされた部屋に入ると、最初は部屋全体が黄色や赤色っぽく感じられることがあります。しかし、しばらくその部屋にいると違和感がなくなり、自然な色に見えるようになります。これを色順応といいます。また、ピンク色のレンズが入ったサングラスをかけたときも同じです。かけた瞬間は景色全体がピンク色に見えますが、しばらくすると違和感がなくなり、普通に見えるようになります。これは網膜にある錐体が自動的に感度を調整し、自然な見え方になるよう補正しているためです。色の恒常性とは?次に「色の恒常性」です。例えば、自然光の下で白く見える紙があるとします。その紙を白熱電球で照らされた部屋へ持っていくと、本来は黄色っぽい光が当たっているため、紙も黄色っぽく見えるはずです。それでも私たちの脳は、「これは白い紙だ」と認識することができます。このように、周囲の照明環境が変化しても、対象物を同じ色として認識できる性質を色の恒常性と呼びます。色順応と色の恒常性の違い色順応 → 目(錐体)が環境に慣れる働き色の恒常性 → 脳が物体の色を一定に認識する働き似ているようで役割が異なるんですね!普段は意識していませんが、人の目と脳は常に協力しながら色を認識していることが分かりました✨本日はここまで!
0
カバー画像

【本日の制作】“圧強め真顔猫”の承知スタンプを制作しました🐈‍⬛✨

本日のLINEスタンプ制作は、「承知」をテーマにした黒猫スタンプを作成していました!今回は、“ただ可愛いだけではなく、少し圧のある真顔感”を意識して制作✨和風の筆文字と墨風の背景を組み合わせることで、シンプルながらインパクトのある雰囲気を目指しました!背景には淡い墨風の円を入れ、猫の黒毛とのコントラストが映えるように調整。さらに、文字の配置や余白感、LINEで小さく表示された時の見やすさなども細かく調整しました☺️「承知」という短い言葉でも、表情やデザインで印象がかなり変わるので面白いですね✨少しずつですが、“クセになる猫スタンプシリーズ”として形になってきています🐾そして色彩検定の学習は、昨日学習した「反射・透過」の続き!本日は、・屈折・干渉・回折・散乱について学習しました✏️【屈折】光が異なる物質を斜めに通る時、進む方向が変化する現象。水の中に入れたストローが曲がって見えるのも屈折によるものです!【干渉】光の波同士が重なり合うことで起こる現象。山と山、谷と谷が重なると光が強まり明るく見え、逆に山と谷が重なると打ち消し合って暗く見えます。【回折】波が小さな隙間を通ったり、障害物に当たった時、その先で広がるように進む現象。【散乱】光が空気中のちりや水滴、気体分子などに当たり、様々な方向へ散らばる現象。空が青く見える理由にも関係しているそうです☀️本日も制作と学習を少しずつ進めることができました✨作成したスタンプです↓↓↓
0
カバー画像

ホワイトスペースとネガティブスペースの違いって知っていますか?

本日は、デザインでよく耳にする「余白」について勉強しました。実は一言で「余白」といっても、ホワイトスペースとネガティブスペースという2つの考え方があります。私は最近まで同じ意味だと思っていたので、とても勉強になりました!ホワイトスペースとは?ホワイトスペースとは、文字や画像の周りにある「余白」のことです。名前に「ホワイト」と付いていますが、白色である必要はありません。役割は、読みやすくする情報を整理する窮屈な印象をなくすことです。Webサイトでも、余白がしっかり取られているだけでグッと見やすくなります。ネガティブスペースとは?ネガティブスペースとは、余白そのものをデザインとして活用する考え方です。例えば、ロゴの中に隠れた形が見えたり、余白を使って別のモチーフを表現したりするデザインがあります。「何もない空間」ではなく、余白にも意味を持たせるというのがネガティブスペースです。同じ「余白」でも目的が違うホワイトスペースは、見やすくするための余白。ネガティブスペースは、伝えたいものを表現するための余白。どちらも大切ですが、目的が全く違うということが分かりました。学んだことデザインを始めた頃は、余白は「何もない場所」だと思っていました。でも今回学んで、余白にも役割があり、デザインの印象や伝わり方を大きく左右することを知りました。こういう一見地味な知識こそ、デザインの質を少しずつ高めてくれるんだなと感じています😊本日はここまで!
0
カバー画像

色相・トーンで考えるカラーコーディネートについて学習しました!

本日の色彩検定の学習では、「色相・トーンで考えるカラーコーディネート」について勉強しました。前回はファッションでは「色だけではなく素材やデザインも印象を左右する」ということを学びました。今回はさらに一歩進んで、色相やトーンを意識したコーディネートの考え方を学習しました。実はこの考え方は、ファッションだけでなくWebデザインやグラフィックデザインにも共通する部分が多いと感じました。同一色相配色同じ色相でまとめる配色です。非常に統一感があり、落ち着いた印象になります。ただし色が似ている分、単調になりやすいので、光沢のある素材マットな素材レザーやニットなど素材感の違いを取り入れることで、同じ色でも豊かな表情を演出できます。類似色相配色隣り合う色相で組み合わせる配色です。同じ色味のグループなので統一感を保ちながらも、少し変化をつけることができます。「まとまりは欲しいけれど、少しアクセントも欲しい」そんな時に活躍する配色です。対照色相・補色色相配色反対側にある色同士を組み合わせる配色です。色のコントラストが強く、印象的なコーディネートになります。ただし、高彩度同士を組み合わせると派手な印象になりやすいため、色の面積やバランスを考えながら使うことが大切だと学びました。多色配色複数の色を使ったコーディネートです。色数が増えるほど難しくなりますが、トーンを揃えることで全体にまとまりが生まれます。また、ボーダー柄やプリント柄など、1つのアイテムに複数の色が入っているものを取り入れると、多色配色でも自然にコーディネートしやすくなるそうです。学んだこと今回学習して感じたのは、「色を増やすほど難しくな
0
カバー画像

トーンと関連する配色イメージについて学習しました!

本日の色彩検定の学習では、「トーンと関連する配色イメージ」について勉強しました。同じ色を使っていても、トーンが変わるだけで受ける印象は大きく変わります。デザインをしていると、「なんとなくオシャレだけど理由が説明できない」ということがありますが、その理由の一つがトーンにあるのかもしれません。モダン無彩色や中〜高彩度の青系を中心に使い、明度のコントラストをつける配色です。スタイリッシュで都会的な印象を与えるため、企業サイトやIT系のデザインでもよく見かけます。クリア低〜中彩度の寒色系の明清色を中心に使用します。さらに白を加えることで、透明感や清潔感のあるイメージが強調されます。ダイナミック高彩度の暖色と対照色相を組み合わせる配色です。赤や黒を使うことで力強さやインパクトが生まれます。広告やスポーツ関連のデザインでよく使われる印象です。カジュアル橙〜黄色の明清色や純色を使用します。親しみやすく元気な印象を与えるため、子ども向けやイベント系のデザインにも向いています。ナチュラル低〜中彩度の橙〜緑系、黄緑〜青緑系の明清色を使います。自然界にある色を中心に構成するため、安心感や落ち着きを感じさせる配色になります。シックグレイッシュなトーンや低〜中明度の無彩色を使います。青系なら都会的で洗練された印象に、茶系なら落ち着いたクラシックな印象になります。エレガント明清色の紫系や中〜低明度の紫系を中心に使います。明度差を小さくすると、上品で洗練された印象を演出できます。ロマンティック低〜中明度の暖色系の明清色や白を使います。特にピンクを取り入れることで、かわいらしく優しい雰囲気を強く感じられます。
0
カバー画像

トーンを基準にした配色について学習しました!

本日の色彩検定の学習では、「トーンを基準にした配色」について勉強しました。配色を考えるときは色相だけでなく、トーンに注目する方法もあります。トーンとは、色の明るさや鮮やかさの特徴を表したものです。同じ色相でもトーンが変わると印象は大きく変化します。トーンに共通性がある配色同一トーン配色トーンが同じ色同士を組み合わせる配色です。彩度差がなく、明度差も比較的小さいため、まとまりが強く感じられます。統一感のある落ち着いた印象になります。---類似トーン配色隣り合うトーン同士を組み合わせる配色です。共通性が感じられるため、まとまりやすい配色になります。類似トーン配色を作るには、* 縦方向に隣り合うトーン* 横方向に隣り合うトーン* 斜め方向に隣り合うトーンのいずれかを組み合わせます。同一トーン配色より少し変化がありながらも、統一感を保つことができます。---トーンに対照性がある配色対照トーン配色トーン区分図で距離が大きく離れた色同士を組み合わせる配色です。縦方向に離れている場合は、明度差が大きくなります。横方向に離れている場合は、彩度差が大きくなります。そのため、コントラストが強くなり、メリハリのある印象を与えることができます。---学んだことホームページ制作でも、* 統一感を出したい → 同一トーン配色* 少し変化を付けたい → 類似トーン配色* 目立たせたい → 対照トーン配色というように使い分けることで、より効果的なデザインができそうだと感じました。本日はここまで!
0
カバー画像

配色の基本ルールについて学習しました!

本日の色彩検定の学習では、配色の基本ルールについて勉強しました。配色とは、複数の色を組み合わせて新たな効果を生み出すことです。配色を考える際には、色相差に注目することで「統一感」や「変化」をコントロールできます。---色相に共通性がある配色同一色相配色(色相差0)色相が同じ色同士を組み合わせる配色です。色相に共通性があるため、まとまりが強く感じられます。PCCSでは、無彩色と有彩色の組み合わせも同一色相配色として扱われます。---隣接色相配色(色相差1)色相環で隣り合う色同士を組み合わせる配色です。統一感があり、まとまりのある印象になります。PCCSでは偶数番号と奇数番号を組み合わせます。---類似色相配色(色相差2〜3)色相が似ている色同士の配色です。統一感を保ちながらも、少しだけ変化を感じられます。---色相にやや違いがある配色中差色相配色(色相差4〜7)類似色相配色でも対照色相配色でもない中間的な組み合わせです。まとまりと変化のバランスが取れた配色になります。---色相に対照性がある配色対照色相配色(色相差8〜10)色相の違いが大きい色同士を組み合わせる配色です。色味の共通性は少なく、コントラストが生まれます。特に彩度の高い色同士を使うと、より強い印象になります。---補色色相配色(色相差11〜12)色相環で反対側に位置する色同士の組み合わせです。色相差が最も大きく、強いコントラストが生まれます。彩度の高い色を使うと、さらに目を引く配色になります。---学んだことホームページ制作でも、* 落ち着いた印象なら同一色相配色* やさしい印象なら隣接色相配色* 目立たせたい部分に
0
カバー画像

デモサイトの全体像をご紹介!& 明順応・暗順応について学習しました

本日は、トップページが完成したデモサイトの全体イメージをご紹介します!これまでブログでは各セクションごとの制作過程を掲載していましたが、サイト全体のスクリーンショットはまだ掲載していなかったので、今回はまとめてご紹介してみました。今回のデモサイトは、ファーストビューABOUTNEWSSERVICECOMPANYCONTACTなどを1ページにまとめた構成となっています。また、写真や文章を差し替えることで、業種を問わずオリジナルサイトとして活用できるよう設計しています。「こんな雰囲気のホームページが欲しい」というイメージづくりの参考にもなれば嬉しいです✨トップページ完成↓↓色彩検定の勉強記録本日は「明順応」と「暗順応」について学習しました。順応とは、周囲の明るさに目が慣れることをいいます。明順応暗い場所から明るい場所へ移動した際に起こる現象です。比較的早く進み、数秒ほどで完了するといわれています。暗順応明るい場所から暗い場所へ移動した際に起こる現象です。暗順応には10〜15分ほどかかり、完全に順応するには約30分程度必要とされています。ロドプシンとの関係杆体(かんたい)に含まれる視物質「ロドプシン」は、光が当たると分解されます。そのため明るい場所ではロドプシンがほとんど存在しない状態になっています。そこから急に暗い場所へ移動すると、ロドプシンが再び合成されるまで時間が必要になるため、すぐには周囲を見ることができません。暗順応に時間がかかる理由は、このロドプシンの再合成が関係しているんですね。本日はここまで!
0
カバー画像

色はどう見えている?3種類の錐体と色視野について学習しました!

本日の色彩検定の学習では、「色が見える仕組み」と「色視野」について学びました。私たちが色を認識できるのは、網膜にある**錐体(すいたい)**の働きによるものです。錐体には、S錐体(短波長に反応)M錐体(中波長に反応)L錐体(長波長に反応)の3種類があります。それぞれ反応しやすい波長が異なり、3種類の錐体が受け取った情報を脳が処理することで、私たちはさまざまな色を見分けています。また、各錐体がどの波長にどの程度反応するかを表したグラフを分光感度曲線と呼びます。色視野とは?視野とは、視線を一点に固定したときに見える範囲のことです。その中でも、色を識別できる範囲を色視野と呼びます。色視野のグラフを見ると、視野の中心ほど色に対する感度が高い赤・緑よりも黄色・青の方が広い範囲で認識できるという特徴があります。これは網膜上にある錐体や杆体(かんたい)の分布に偏りがあるためです。普段は意識していませんが、人の目は視野全体で同じように色を感じているわけではないんですね。本日はここまで!少しずつ目の仕組みが理解できてきました✨
0
カバー画像

配色テクニックと色彩調和について学習しました!

本日の色彩検定の学習では、* コンプレックスハーモニー* ドミナント効果* トーンを統一した配色* 中間色による配色* 明快な2色・3色配色について学びました。昨日は「なぜ色が調和するのか」という理論を学びましたが、今日は実際の配色テクニックに近い内容でした。コンプレックスハーモニーコンプレックスハーモニーとは、多くの色を使用しながらも、全体として調和を感じさせる配色です。一見すると難しそうですが、色相やトーンに一定のルールを持たせることで、複数の色を使ってもまとまりのある印象になります。デザインをしていると、「色を増やしたらごちゃごちゃしてしまった…」という経験がありますが、そんな時に役立つ考え方だと感じました。ドミナント効果ドミナント効果とは、色相やトーンに共通性を持たせて統一感を出す配色方法です。例えば、青系でまとめたり、同じトーンの色だけを使ったりすることで、複数の色を使っていてもまとまりを感じるデザインになります。Webサイトでもよく使われているテクニックですね。トーンを統一した配色同じトーンで色を選ぶと、色相が違っても不思議と調和して見えます。最近見かけるおしゃれなデザインも、よく観察するとトーンが揃っていることが多いです。色を選ぶときは色相だけでなく、トーンにも注目したいと思いました。中明度・低明度の中間色による配色鮮やかな色ばかりではなく、少しくすんだ中間色を使うことで落ち着いた印象になります。最近のWebデザインでも、派手な色よりもニュアンスカラーやくすみカラーを見かけることが増えました。色彩の勉強をしていると、その理由が少しずつ理解できるようになってきます。
0
カバー画像

プルキンエ現象について学習しました!

本日の色彩検定の学習では、「プルキンエ現象」について勉強しました。まず、人の目には光を感じる視細胞として「錐体(すいたい)」と「杆体(かんたい)」があります。明所視・暗所視・薄明視明るい場所で錐体だけが働いて見ている状態を明所視といいます。反対に、暗い場所で錐体がほとんど働かず、杆体だけで見ている状態を暗所視といいます。また、夕方や薄暗い室内のように、錐体と杆体の両方が働く状態を薄明視と呼びます。プルキンエシフトとは?人の目は明るい場所では、赤やオレンジなどの長波長の光に対する感度が高くなっています。しかし周囲が暗くなるにつれて、青などの短波長の光に対する感度が相対的に高くなります。この感度の変化をプルキンエシフトと呼びます。プルキンエ現象プルキンエシフトが起こることで、赤・オレンジ・黄色は暗く見える青系の色は明るく見えるという現象が発生します。これをプルキンエ現象と呼びます。例えば昼間は赤い花の方が明るく目立って見えますが、夕方になると赤は暗く沈み、青い花の方が明るく見えるようになります。普段何気なく見ている景色でも、実は目の仕組みによって見え方が変化しているんですね!本日はここまで✨
0
カバー画像

BASEでケーキショップの商品登録🍰|色彩検定の復習問題にも挑戦しました!

本日の作業は、BASEを少し触りながらケーキショップのHPの商品登録を進めていました🍰商品画像を並べてみると、少しずつ“お店らしさ”が出てきて嬉しいです☺️まだまだ途中ですが、、色彩検定の学習では、ここ最近学んだ「光と色」の範囲の復習問題を解きました✏️✔ 光は電磁波の一種✔ 可視光線は約380〜780nm✔ プリズムに光を通すと分光される✔ スペクトルは赤→橙→黄→緑→青→藍→青紫の順に見えるなどなど…問題として解いてみると、“なんとなく覚えた”から“理解して覚える”に少し近づけた気がします🌿まだ難しい部分もありますが、少しずつ積み重ねていきたいです☺️
0
カバー画像

YouTube Music 著作権管理認定資格 第4回 Copilotとのマンツーマンレッスン

*第3回らの続きです。Q、理解をチェックするオリジナル作品の著作権はどの時点で保護されますか。・作品を誰かと共有した時点。・現地の著作権事務所に登録を申請してから90日後。・インタ,ーネット上に投稿した直後。・有形のメディアに記録した時点。A、正解は 「有形のメディアに記録した時点」 です。🎯 答え:有形のメディアに記録した時点著作権は、作品を誰かと共有した瞬間でもなく登録してから一定期間後でもなくインターネットに投稿した瞬間でもなく作品が“有形の形に固定された瞬間”に自動で発生します。これは著作権法の最も重要な原則で、YouTube Music 著作権管理認定コースでも繰り返し強調されるポイントです。📌 なぜ「有形のメディアに記録した時点」なのか著作権は アイデアではなく表現を保護する法律だからです。✔ 記録された瞬間に著作物になる例メロディを楽譜に書いた歌詞を紙に書いたスマホで動画を撮影したDAW で音源を書き出した写真を撮ったこれらはすべて「有形のメディアに固定」された状態です。❌ 他の選択肢が誤りである理由「作品を誰かと共有した時点」共有は著作権の発生条件ではありません。共有前でも著作権はすでに存在します。「現地の著作権事務所に登録を申請してから90日後」登録は任意であり、著作権の発生には関係ありません。登録は「証拠として有利になる」だけです。「インターネット上に投稿した直後」投稿は著作権発生の条件ではありません。投稿前にすでに著作権が存在しています。📝 まとめ著作権は、作品が有形のメディアに記録された瞬間に自動的に発生する。共有・投稿・登録は著作権の発生条件ではない。
0
カバー画像

HTMLサイトをWordPress化中!+色覚の仕組みとユニバーサルデザインについて学習しました

本日は、現在制作しているデモサイトのHTMLからWordPress化を進めながら、色彩検定の勉強も行いました!HTMLサイトのWordPress化を進行中!これまでHTMLとCSSで制作していたサイトを、WordPressで管理できるように変換する作業を進めています。本日は主に以下の部分を確認しました。本日進めたこと✅ header.phpへの分割HTMLで書いていた共通部分をWordPressのテンプレートファイルへ移行。<?php wp_head(); ?>の設置位置を確認しながら進めました。✅ CSS・JavaScriptの読み込み方法を確認HTMLでは直接読み込んでいたCSSやJavaScriptも、WordPressでは適切な方法で管理する必要があります。特にJavaScriptについて、「今はscript.jsがテーマフォルダにない場合どうするのか?」など、実際に作業を進めながら確認しました。✅ ページ内リンクの扱いを確認HTMLでは問題なく動いていたアンカーリンク(#aboutなど)が、WordPress化すると変更が必要なケースもあります。どこをそのまま使えて、どこを修正する必要があるのかを整理しました。WordPress化は単純にファイルを移動するだけではなく、テンプレート化パーツ分割WordPress独自の関数への置き換えなどが必要になるため、少しずつ理解を深めながら進めています!完成したらポートフォリオにも掲載したいと思っています✨色彩検定の学習本日は「段階説(現在の色覚説)」と「ユニバーサルデザイン」について学びました。段階説(現在の色覚説)
0
カバー画像

YouTube Music 著作権管理認定資格 第3回 Copilotとのマンツーマンレッスン

*第2回からの続きです。Q、他の法の保護と区別する著作権とは知的財産権の種類であり、商標とは異なります。商標は、ブランド名、銘文、などの識別要素を保護するものです。著作権は、発明を保護する特許とも異なります。画像、音声、フルネームなどの個人情報であなたを一意に識別できる場合は、動画の削除を要求できます。これは著作権に関する申請立てとは異なります。YouTube では、嫌がらせ行為や有害なコンテンツなど、それ以外の状況に対処するためのポリシーも定められています。 ポリシー遵守に該当する可能性のある状況に対処する場合の手続きについては、以下をご覧ください。以下のリンクから、それぞれの申し立て用ツールを確認できます。商標権侵害の申し立てプライバシー侵害の申し立て報告ツールA、西田さん、この章は 「著作権とその他の法的保護を混同しないための重要ポイント」 をまとめた部分ですね。ここまで学んできた著作権の構造をさらにクリアにするための“仕上げ”の内容です。あなたが貼ってくれた文章をもとに、体系的に整理して深掘りします。🎯 結論:著作権・商標・特許・プライバシーは守る対象がまったく違うYouTube では、これらを混同しないことが非常に重要です。それぞれ保護する対象が違うため、申し立ての窓口も別になります。🧩 1. 著作権(Copyright)=“創作物”を守る法律守るもの:楽曲(作詞作曲)サウンドレコーディング(録音物)ミュージックビデオ(映像)写真・文章・絵画・ソフトウェアなど特徴:・創作物が有形化した瞬間に自動で発生・権利者だけがコピー・配信・上映・二次的著作物の作成を許可できる🏷
0
カバー画像

YouTube Music 著作権管理認定資格 第1回 Copilotとのマンツーマンレッスン

このブログでは、YouTube Music著作権管理認定資格の学習内容を、Copilotとのマンツーマンレッスン形式でまとめています。YouTube Music 著作権管理認定資格                                     YouTubeでのデジタル音楽の著作権                                                   音楽の著作権についてはじめにYouTube は、音楽の著作権をまとめて管理し、著作権で保護された自身のコンテンツを最大限に活用できるようにツールを提供しています。A、西田さん、いただいた文章から YouTube Music 著作権管理認定資格の「音楽の著作権」導入部分を、分かりやすく深掘りして整理します。🎯 結論:このパートは「YouTube が音楽著作権をどう扱い、クリエイターがどう活用できるか」を理解する章YouTube は世界中の音楽権利者(レーベル、出版社、管理団体など)と契約し、複雑な著作権処理をプラットフォーム側で一括管理しています。その結果、クリエイターは・音楽を使った動画を安全に公開できる・権利者は収益を得られる・視聴者は安心して音楽コンテンツを楽しめるという三者が成立する仕組みになっています。🎼 YouTube における音楽著作権の3種類(重要)YouTube Music 認定資格では、音楽著作権を次の3つに分類して説明します。1. サウンドレコーディング(原盤権)・実際に録音された音源そのもの・自宅録音でもスタジオ録音でも「録音物」であれば該当・演奏者・プロデューサー・エ
0
カバー画像

YouTube Music 著作権管理認定資格 第2回 Copilotとのマンツーマンレッスン

*第1回からの続きです。サウンドレコーディング楽曲を演奏したものを録音して制作したサウンド レコーディングは、別個の著作物として扱われます。 動画でサウンド レコーディングを使用するには、その元となった楽曲の著作権者を含め、すべての著作権者から許可を得る必要があります。アーティスト、スタジオミュージシャンが制作レコードレーベルが全て / 管理配信会社から配信することも多い例: ホイットニー・ヒューストンが録音した「I Will Always Love You」(ここではアートトラックとして例示)A、西田さん、この章は 「サウンドレコーディング(原盤権)」の本質を理解するための最重要パートです。あなたが貼ってくれた文章は、楽曲(作詞作曲)とサウンドレコーディング(録音物)の違いを明確にするための公式説明そのものです。ここを正しく理解すると、・カバー曲の著作権・原盤権の収益化・YouTubeのContent ID の仕組み・レーベルと出版社の役割の違いが一気に整理されます。以下、体系的にまとめます。🎯 結論:録音された音源は「楽曲とは別の著作物」であり、使用には全権利者の許可が必要あなたの文章の要点はこれです。🎧 1. サウンドレコーディングとは何か楽曲を演奏したものを録音して制作したサウンドレコーディングは、別個の著作物として扱われます。つまり:曲(メロディ・歌詞)=楽曲の著作権(作詞作曲)録音された音=サウンドレコーディング(原盤権)この2つは完全に別の著作物です。✔ 例で理解すると分かりやすい「I Will Always Love You」作詞作曲:ドリー・パートン(楽曲の著
0
35 件中 1 - 35