LogoMark.png

鳥越友菜/情報デザイン演習IIA の履歴(No.13)

かみしも温泉センター(廃業済み)

陰謀論まとめwebサイト♬
sample.png
↑

プロジェクトの概要

↑

これは何？

陰謀論とそれを信仰する人々の心理傾向、信仰に陥りやすい精神状態についてまとめる

↑

背景と目的

昔からよく「陰謀論」という言葉は目にしていたが、世界的なコロナ禍に陥ってからさらにその言葉をよく目にするようになった。陰謀論を信仰する人々(いわゆる陰謀論者)の主張や態度を見るに、新興宗教への信仰と似た性質を感じ興味を惹かれたため調査しまとめようと思いこのプロジェクトを企画

↑

制作ツール

html, css,chatGPT

↑

🌟成果物とその仕様🌟




進捗記録




↑

2025.05.19

サイトのホーム部分の画像作成(chatGPT)、文章作成、調査

flatearth1.png




↑

2025.05.12

↑

作業の記録

↑

2025.04.28

↑

アドバイス等

↑

好評を得た点

↑

2025.04.21

↑

今回制作したプロトタイプ

plot.png




↑

プロトタイプ制作の方法

↑

Webの公開方法

↑

Webの内容

↑

Webのネーミング

かみしも温泉センター(廃業済み)



↑

2025.04.14　

↑

現状調査｜テーマ内容の先行事例

↑

ToDoリスト

↑

制作上のアイデア　

↑

2025.04.07

↑

プロジェクトのテーマ候補

↑

《参考リンク》

↑

▪️花札

↑

▪️香水

↑

▪️伊藤計劃

↑

▪️綾辻行人

↑

▪️本の装丁

↑

▪️すいぞくかん

↑

▪️陰謀論まとめ

@import url('https://fonts.googleapis.com/css2?family=Kosugi+Maru&display=swap');

body {

 font-family: 'Kosugi Maru', sans-serif;
 background-color: #ffd6e8; /* いちごミルクピンク背景 */
 color: #00ff00;
 margin: 0;
 padding: 0;
 filter: contrast(1.5) saturate(1.8);

}

header {

 background-color: #ffcc00;
 color: #ff0066;
 text-align: center;
 padding: 2em;
 border-bottom: 4px dotted #ff0066;
 box-shadow: 0 0 15px #ff0066;
 position: relative;

}

header h1 {

 font-size: 3.2em;
 font-weight: bold;
 letter-spacing: 0.12em;
 text-shadow: 2px 2px #ff00ff;

}

header p {

 font-size: 1.4em;
 font-style: italic;
 text-shadow: 1px 1px #990099;

}

#menu-toggle {

 display: none;
 background: none;
 border: none;
 font-size: 2em;
 color: #ff00ff;
 position: absolute;
 top: 1.5em;
 right: 1em;
 cursor: pointer;
 user-select: none;

}

nav ul {

 background-color: #00ffff;
 list-style: none;
 margin: 0;
 padding: 1em;
 display: flex;
 flex-wrap: wrap;
 justify-content: space-around;
 font-weight: 900;
 font-size: 1.3em;
 text-shadow: 1px 1px #ff00ff;

}

nav a {

 color: #ff0099;
 text-decoration: underline dotted;
 background-color: #ffffffcc;
 padding: 0.3em 0.7em;
 border: 3px groove #ff66ff;
 margin: 0.3em;
 transition: 0.3s;
 box-shadow: 0 0 10px #ff00ff;

}

nav a:hover {

 background-color: #ffff00;
 color: #000;
 transform: scale(1.2) rotate(-5deg);
 text-shadow: 0 0 5px #ff00ff;
 box-shadow: 0 0 20px #ff00ff;

}

main {

 background-color: #ffd6e8; /* いちごミルクピンクで統一 */
 padding: 2.5em;
 filter: contrast(1.3);
 border: 5px double #ff33cc;
 box-shadow: 0 0 20px #ff33cc;

}

.intro h2 {

 font-size: 2.4em;
 background-color: #ffeeff;
 padding: 0.6em;
 border-left: 8px solid #ff33cc;
 text-shadow: 1px 1px #ff00ff;

}

.intro p {

 font-size: 1.3em;
 margin: 0.6em 0;
 color: #990099;
 text-shadow: 1px 1px #ff99ff;

}

.flyers h2,
.attractions h2 {

 font-size: 1.8em;
 color: #ff3399;
 border-bottom: 3px dashed #ff66cc;
 padding-bottom: 0.4em;
 margin-bottom: 1.3em;
 text-shadow: 1px 1px #ff00ff;

}

.flyer {

 border: 4px ridge #ff99ff;
 background-color: #fff0f5;
 padding: 1.2em;
 margin-bottom: 2em;
 box-shadow: 0 0 15px #ff33cc;

}

.flyer img {

 width: 100%;
 max-width: 320px;
 border: 3px dashed #cc33ff;
 margin-bottom: 0.7em;
 filter: saturate(2);

}

.message {

 margin-top: 3.5em;
 background-color: #ffffcc;
 border: 5px double #ffcc00;
 padding: 1.2em;
 font-size: 1.4em;
 box-shadow: 0 0 25px #ffcc00;
 text-shadow: 1px 1px #ff9900;
 color: #cc6600;

}

footer {

 background-color: #ffccff;
 color: #9900cc;
 text-align: center;
 padding: 1.3em;
 font-size: 1em;
 border-top: 5px solid #ff33cc;
 box-shadow: 0 0 15px #ff33cc inset;
 user-select: none;

}

/* ハンバーガーメニュー対応 */
@media (max-width: 768px) {

 #menu-toggle {
   display: block;
 }
 nav ul {
   display: none;
   flex-direction: column;
   align-items: center;
 }
 nav ul.open {
   display: flex;
 }

}