UX / UI のデザインに強いWebシステムの開発と、BtoB Webマーケを支援するWeb制作を提供する
N's Creates (エヌズクリエイツ) 株式会社 UIコーダー 齋藤 (@31mskz10) です。

最近のウェブサイトやアプリには、アイコンがよく使われています。
「アイコン」というシンプルなマークを見るだけで、ユーザーはどんな意味や機能なのか理解できるのは面白いなと感じます。

今回の記事では、数あるアイコンの中から「星」アイコンがどのようなUIに使われているのかと、アイコンが持つ意味について考えてみます。

星アイコンが使われているUI

お気に入り

まず、星アイコンでよく見かけるのが「お気に入り」です。
X（旧：Twitter）のいいねも昔は「お気に入り」で星アイコンが使われていました。

しかし、SNSの投稿に対するリアクションは、「お気に入り」というよりも「いいね」の方がしっくりきます。

「お気に入り」となると、いいねほど気軽ではなく、少し特別なものというイメージが付いてきます。

ブックマーク

お気に入りに近い概念ですが、ブックマークにも使われます。
ブラウザのGoogle Chrome・Firefoxのブックマーク機能には星が使われています。

ただし、Safariに関してはブックマークには「しおり」のアイコンが使われていて、ブックマーク内の「お気に入り」フォルダが星アイコンになっています。

ちなみに、X（旧：Twitter）のブックマークも「しおり」のアイコンを使っています。

評価

次によく見かけるのは評価です。
「三つ星レストラン」なんて言いますから、ITが発達する前から「星 = 評価の対象」という感覚があったのかもしれません。

Amazonのレビューも星を並べて表現していますね。

成果物や特典のアンロック

ゲームやアプリ内で特定の成果を達成した時、報酬や特典を示すマークとして星アイコンが使用されているのもよく見かけます。

難易度やレベルの表示

特にゲームや教育関連のアプリで、ユーザーのレベルや難易度を示すために使用されます。

また、レベルとは少し違うかもしれませんが、レア度を表すためにも、星はよく使われていますね。

星アイコンが持つ意味

こうしてみると、星アイコンは共通して「特別なもの」というイメージが付いているのが分かります。

X（旧：Twitter）が「お気に入り」から「いいね」にしたことも、お気に入りだと特別な投稿に対するリアクションのようになってしまうから、気軽にアクションして欲しいという意図で「いいね」に変更したのかもしれません。

逆に投稿数が少なかったり、後で投稿を見返す確率が高いようなものの場合は「お気に入り」にした方が良いかもしれません。

UX / UI のデザインに強いWebシステムの開発と、BtoB Webマーケを支援するWeb制作を提供する
N's Creates 株式会社は、神戸三宮オフィスまで週１出社（それ以外はリモートワーク）できる「デザイナー」「エンジニア」を募集しています。

興味のある方は、カジュアル面談しますので気軽にお問い合わせください！

saito

高校時代にIT・Web業界に興味を抱き、神戸電子専門学校で2年間デザインやWeb実装について知識を得た後、新卒でN′sCreates株式会社のデザイナーとして入社。ミッションである｢解で快を創る｣を実現するべく日々の業務に向き合い、より良い提案を心掛けています。また、学生時代からWeb制作に関わる方のためのセミナーイベント「CSS Nite in KOBE」のスタッフとして業界の最先端に触れ、自主的に学習してきた知識やスキルを武器に、常に成長を続けている。