サイトについて

サイトについて

「うぇぶ、ひゃっくり」のコンセプト

「うぇぶ、ひゃっくり」は、「わかりやすく伝える」ことを、Webデザインと子ども向けプログラミングの両方から考えるサイトです。画面で伝える工夫は、実在するWebサイトを1つずつ分析する「Webサイト100選」で、教える場で伝える工夫は、子ども向けプログラミング教室で教えて気づいたことからまとめています。

このサイトの内容

ひゃっくり君
ひゃっくり君
どんなことを発信してるサイトなの?

このサイトでは、Webサイトを「なんとなく見る」のではなく、
「なぜ伝わるのか」「なぜ使いやすいのか」「どう作られているのか」を分析しながら記録しています。
気づいたことを言葉にし、実際に作って試しながら理解を深めることを大切にしています。

“見る→分析→作る→学ぶ”を繰り返している感じです!
AIMI.
AIMI.

こんな人に読んでほしい

  • Webデザインを学び始めて、「いいデザイン」を言葉にできるようになりたい人
  • 参考にしたいサイトの、どこをまねすればいいか知りたい人
  • 子どもにプログラミングを教えている人、これから習わせたい保護者の人

サイト名「うぇぶ、ひゃっくり」に込めた意味

ひゃっくり(しゃっくり)

一度気になると止まらない探究心を表しています。

ひゃっくり君
ひゃっくり君
気づいたら次のサイトまで見ちゃうやつだ!

良いデザインを見ると、「なぜこうなっているんだろう?」と分析したくなる感覚を表現しています。

ひゃく(百)

「100事例分析」を目標に、学びを積み重ねていく姿勢を意味しています。

ひゃっくり君
ひゃっくり君
見て終わりじゃなくて、言葉にして整理するのが大事なんだよね!

くり(栗)

栗はこのサイトのモチーフです。小さな積み重ねを大切にしながら成長していく姿勢を表しています。

うぇぶ、ひゃっくり|Webサイト100選

このサイトで発信している内容

ひゃっくり君
ひゃっくり君
具体的にはどんな記事があるの?

このサイトの柱は2つです。

柱1 Webデザイン(画面で伝える工夫)

  • Webデザイン分析(Webサイト100選)…実在するサイトの色・余白・情報の並べ方を分析
  • 学習ログ・参考書…Webデザインやプログラミングの勉強の記録
  • 制作記録…Web制作やWordPressテーマ(サイトの見た目を決めるひな形)づくり
  • AI活用…AIを使って作業を早くする工夫

柱2 子ども向けプログラミング(教える場で伝える工夫)

  • Scratch(スクラッチ)やマイクラなどを使った、子どもへの教え方
  • プログラミング教室で見た子どもの変化
  • 心理学や歴史をもとに、子どもの学び方を考えたこと
ひゃっくり君
ひゃっくり君
学習だけじゃなくて、ちゃんと作る系も多いんだね!

サイト制作へのこだわり

ひゃっくり君
ひゃっくり君
サイト自体も作ってるの?

このサイトは、配布されているテーマ(見た目のひな形)を使わず、WordPressのテーマを自分で作りながら運営しています。
デザインだけでなく、情報の伝わりやすさ・使いやすさ・更新しやすさも意識しながら改善しています。

学びながらサイトも少しずつ育てています!
AIMI.
AIMI.

カテゴリ紹介

「うぇぶ、ひゃっくり」では、Web制作や学習の過程をカテゴリごとに整理して発信しています。

ひゃっくり君
ひゃっくり君
どんな記事が読めるの?
気になるカテゴリから読めるように分けてるよ!
AIMI.
AIMI.

Webデザイン分析

Webデザイン分析

ひゃっくり君
ひゃっくり君
Webデザイン分析って何するの?

実際のWebサイトを見ながら「なぜ伝わるのか」「なぜ使いやすいのか」を分析しています。
使いやすさ・色・余白・配置・動きなどを観察し、
“なんとなく良い”を言葉にして学ぶカテゴリです。

学習ログ(過程・試行錯誤の記録)

学習ログ

ひゃっくり君
ひゃっくり君
学習ログって勉強日記みたいな感じ?

学んでいる最中の気づきやつまずき、試行錯誤の過程をリアルタイムで記録するカテゴリです。
Web制作やコーディング学習の進捗をまとめています。中は「Webデザイン」「プログラミング」「参考書」の3つに分かれています。

参考書(学習ログの中)

ひゃっくり君
ひゃっくり君
どんな本で勉強したのか知りたい!

Webデザインやプログラミングを学ぶときに読んだ本や、自分に合う本の選び方をまとめる、学習ログの中のカテゴリです。
図解の多い本が合った経験や、図書館で読み切れる本を見つけるコツなどを紹介しています。

AI活用ログ

AI活用ログ

ひゃっくり君
ひゃっくり君
AIってどんなふうに使ってるの?

AIを使ったWeb制作や、勉強を早く進める工夫、コード(サイトを作るための命令文)の直し方などを、実際に試したうえで記録しています。

制作記録

制作記録

ひゃっくり君
ひゃっくり君
実際にサイトも作ってるの?
作っています。このサイト自体もWordPressテーマを自作しながら改善中です。
AIMI.
AIMI.

Webサイト制作やWordPressテーマづくり、画面の使いやすさの改善、作るときのメモなどを記録しています。 「作る過程」も含めて共有することで、実践的な学びにつながる内容を目指しています。

学んだこと(体験を通した気づき)

学んだこと

ひゃっくり君
ひゃっくり君
「学んだこと」は何が違うの?

学習ログが「過程」の記録であるのに対し、こちらは実際にやってみて得た気づきや体験を、自分の言葉でまとめるカテゴリです。
成功したことだけでなく、つまずいた経験も含めて、初心者にも伝わりやすい形で整理しています。プログラミング教室で子どもに教えたときや、Webデザインの勉強で、「伝わった」「伝わらなかった」と感じた体験を中心にまとめています。

考えごと

考えごと

学び方や働き方、教育について考えたことを書いてるよ!
AIMI.
AIMI.

「どうしたら子どもに伝わるか」「どうしたら学びが続くか」を、プログラミング教室で教える経験や毎日の体験から考えたことをまとめています。心理学の考え方や歴史を手がかりにした記事もあります。

運営者について

運営者の学習背景や目標については「はじめまして」で紹介しています。
AIMI.
AIMI.

はじめましてを見る