#author("2026-07-10T15:59:43+09:00","default:member","member") #author("2026-07-10T16:03:49+09:00","default:member","member") *アンビグラムハクブツカン 見て、触って楽しめるアンビグラム展 #image(Museum.jpg) -''安藤貴仁'' -''Keywords：Ambigram, Web'' -[[webサイト>https://andotakahito.github.io/ambigram/]] -__[[アンビグラムで作ってほしい単語>https://docs.google.com/forms/d/e/1FAIpQLScL_nhrFcnGq5mcwZjh5v663VkxdiXq-Fwgn1CsNW8IlGADHQ/viewform?usp=dialog]]__ ← 面白そうな単語の組み合わせがあればここからお願いします。類義語でも対義語でも造語でも大丈夫です！ ~ //***CONTENTS //#contents2_1 //~ **概要 ***これは何？ 「アンビグラム」の魅力をWebサイトと実際に手で回して理解できる制作。 ~ ***背景と目的 近年、様々なロゴデザインが溢れており、独創的なロゴデザインを見る機会が減った。ロゴデザインは会社や企業の認知度をより高めるために考えられているため、印象に残るロゴデザインを作ることができれば人々の注目を集めることができると考えた。そこで独創的で、インパクトのある「アンビグラム」に注目し、紹介、展示しようと制作を始めた。 しかしアンビグラムは認知度が極めて低い点と印象を残すことはできるが、慣れていないとなんて書いてあるか読み取ることが難しいという点が現状の課題点である。 本研究では、「認知度が低い」点と「理解するのが難しい」点に着目し、アンビグラムという変わったデザインをしっかりと知ってもらうことが目的である。 ~ ***コンセプト -「見て、触って楽しめるアンビグラム展」をメインテーマとして、アンビグラムを理解、認知してもらうために、画角を固定した状態で展示するのではなく、実際に動いたり、手で回したりして、発想の転換を楽しめる展示を目指す --ウェブ上でどのように動かしたらいいかを説明を添えて伝える --実際にアンビグラムを手で回転できるように展示する ~ &image(image1.jpg,50%);&image(image2(menu).jpg,50%); ~ -テーマが「アンビグラムハクブツカン」のため、様々な技法を用いたアンビグラムを紹介する --５種類以上、10枚以上のアンビグラムを製作する ~ -アンビグラムができるまでの工程を載せる --以下は作成までの流れ 【文字から作成】 1. 作りたい字を考える (４字熟語や形が似ている言葉が望ま しい ) 2. 反転したり回転させたりして同じような形状の部分を探す ( 回転や文字を崩したりするため紙で試行錯誤することが推 奨 ) 3. 形を整え、デジタルで清書して完成 【型から作成】 1. 作りたい型を決め、それに合いそうな単語を検索するか造 語する ( 造語しても型に合わないと判断すると既存の作成し た型で作ることも多々 ) 2. 型に添えるよう情報量の増減を繰り返す 3. 上同様デジタルで清書して完成 ~ ~ ***成果物の仕様 -Web --HTML、CSS、JavaScriptを用いた動きのあるサイト -作品の展示 --回転テーブルに作品を貼り付け、実際にアンビグラムを回せるようにする ~ ***制作ツール -Illustrator -アイビスペイント -Visual Studio Code ~ ***プロジェクトの期間 プロジェクトの期間｜2026.4.10 - 2026.12.4 ~ ***まとめ //&color(red){プロジェクトが完結したら「まとめ」を記載して下さい。}; ~ ~ //**調査 ***現状調査 -[[アンビグラム制作1>https://note.com/kasakasaumbrella/n/n37211b7ddff0]] -[[Σ | POTEFU >https://potofu.me/sigma]] -[[ 挑戦 / 戦場 >https://withnews.jp/article/f0180101006qq000000000000000w00o10101qq000016526a]] ~ ***先行事例 -[[Σさん作品集>https://posfie.com/@912_sigma/p/y34HMm5]] ~ ***技法・技術情報 Illustrator HTML,CSS,JavaScript ~ ~ //**プロジェクト管理 //***スケジュール //&color(red){計画的な遂行のために、進行管理表を作成してリンクして下さい。}; ~ ***ToDo -新規サイトを構築し、デザインを明るくする -過去に制作したサイトがpc版にしか対応していないためスマホ版も制作する -とにかく新規アンビグラムの制作 -アンビグラムの歴史をまとめたページを作る(未定) -手で触れる用のアンビグラムを、実際にプリントアウトし大きさを調整する //&color(red){やるべきこと（タスク）を箇条書きにします。}; //&color(red){完了後は「%%取り消し線%%」あるいは「// コメントアウト」」}; //***NotToDo //&color(red){やらないこと：何をするかではなく「何をしないか」を考える}; //&color(red){例：10人以上の会議には出ない。苦手なことは誰かに頼む・・}; ~ ~ #hr CENTER:''進捗記録'' &color(red){最新の情報を一番上に記載して下さい（古い記事が下へ沈む）。}; #hr ~ ~ **2026.7.10 -中間発表 --発表のために学科サイトの見直しと更新 ~ **2026.7.3 -学科サイトの更新 --背景と目的を概要集と合うように編集した -新規アンビグラムの作成 ※↑ほぼ没になった ~ **2026.26 -概要集の作成 [[https://ksumail-my.sharepoint.com/:b:/g/personal/iwata_mail_kyusan-u_ac_jp/IQAlJvpfCNOdTIn7eSHoyaTYAZxcUeoTWlTigL2RZ5jMCiE?e=DNj9DP]] ~ **2026.19 -5/29に作成した「等間隔」の仕上げ #image(evenly_spaced.jpg,70%); 【テーマ】 -斜線で上部を分けている様子が部屋に日差しが差し込んでいるように見えた -本来、屋内に物を置くつもりはなかったが「隔」の部分が分かりづらかったため、 前に観葉植物を設置した ~ ※むりやり感が強いので完成したが展示するか迷走中 ~ **2026.12 -[[サイトマップの更新>https://www.figma.com/design/jIOx4AUuGleNNb59mR2ZBk/%E7%84%A1%E9%A1%8C?t=5vYgoqSYvph5Wmjm-1]] #image(Site_Map.png) ~ **2026.6.5 -新規アンビグラム作成 #image(Backlit.jpg,70%); 90°旋回型アンビグラム『逆光』 ~ 【テーマ】 -「逆光」は眩い光のイメージがあるため、しんにょうの部分をスポットライトで表現した -デザインだけだと逆光の印象が薄いので背景で伝わりやすいようにした -光から虹を連想したためスポットライトの中に虹色を追加した ~ ~ **2026.5.29 %%-新規アンビグラム「等間隔」の製作%% ↑__形に納得がいっていないため一時中断__ #image(evenly_spaced1.jpg,70%) 上面が黒の背景、下面が白の背景でモノクロな印象でデザインしようと考えたが不恰好なため一時製作をやめる ~ ~ **2026.5.15 Webサイト製作 ~ **2026.5.8 -完成イメージ画像の制作 &image(image1.jpg,50%);&image(image2(menu).jpg,50%); ~ **2026.5.1 -発表に向けてサイトの更新 -以前の学科サイトページをこのページに移行 --__ [[安藤貴仁/情報デザイン研究I]] __ --__ [[安藤貴仁/情報デザイン研究II]] __ **2026.4.24 -html等を最初から作り直して全体的な明るさを上げる取り組み -AIに原型を作ってもらったが自分の想定していたものと乖離していたため断念 ↑以降の制作時もAIで試しに作ってみて気に入ったら採用する方式でWeb制作を続ける **2026.04.17 相談内容 -アンビグラム、サイトで伝えたいこと -アンビグラムの魅力とは --何が面白い --深掘り -アンビグラムの歴史 -スマホで見れるように作る #image(IMG_0083.jpg) **2026.04.10 -情報デザイン研究Ⅱ「アンビグラムハクブツカン」継続 __上記研究でこれからすること__ --新規アンビグラム継続 --Webサイトの一新 --触って動かせれるアンビグラムを印刷 &image(Museum.jpg,50%);&image(museum_inversion.jpg,50%); ~ #settextcolor(#000000)