大村雅人/卒業研究I
をテンプレートにして作成
HOME
ABOUT
最新の更新
2021
MEMBER 2021
青木暁光
石坂大翔
出光美心
岩崎貴生
岩下雄真
内尾颯太
江川珠貴
大中啓旦
亀田日向
川村洸太
木村円香
久保絢菜
倉員優実
桑原歩未
鴻上早紀
崔昊
佐光美憂
柴田一輝
竹谷匠冬
田籠祐貴
田代爽乃
内藤彩乃
西山実伶
濱有希子
濱田侑里
藤本唯人
松岡佑樹
松藤陽
村山陽菜
山田宗周
渡邊来美
渡辺侑貴
中西華子
原田朋奈
水田修太朗
宮副咲葉
猪須大翔
川面翔太
隈翔太
柴田葉月
角祐菜
豊岡壮大朗
吉井麻吏菜
2022
MEMBER 2022
棈松智也
梅木悠民
江頭奏
大井このか
大石颯
太田糸音
太田姫奈
越智楓
鎌田真幸
楠田佑月
興梠媛愛
後藤太成
坂井彩華
指方依緒
徐泰陽
杉野市之助
堤晴司
角田雄一
中井千尋
原朋恵
平嶋明日花
増田里奈
深町彩海
藤島早希
宮路咲希
梁井英翔
山口愛麗
山本彩花
松田葉奈
松本龍太郎
熊谷涼花
近藤ひかる
善結穂
待永萌衣
三浦遥
石松匡広
上田莉帆
宇田川春稀
宇美希美
佐野美和
竹之内咲希
土斐崎種定
野村優亜
福田千紗
山川彩香
山田侑加子
重松優花
甲斐陸斗
2023
MEMBER 2023
秋月靖雅
浅田真優花
阿南慶子
荒谷唯斗
安藤貴仁
池邉成
井上大河
岩本愛結
梅﨑美和
浦朱里
江村梨里香
大場こころ
勝田喜一
亀崎瑞穂
神田舞
白井くるみ
髙市遥
竹松莉羽
寺田圭志
中村心香
原晴紀
菱谷実来
日山晃良
平崎千夏
福井涼
堀玲二
山口恵
早稲田加奈恵
渡邊優希
十時明日香
石井彩晶
大神槙之介
大熊玄樹
大山花音
岡萌絵子
荻野美咲
鐘ヶ江雅
金田桜子
北村美優香
清野梨果
高庄玲衣
津覇稜也
中川飛鳥
福屋早希乃
脇山千寛
2024
MEMBER 2024
芦谷心渚
安部詩織
池田隆之介
伊藤早紀
越智花凛
金ヶ江光千瑠
蒲田花菜
川村玲太
菊池真桜
後藤未羽
齊場由布
佐々木陽菜
佐藤美月
猿本大翔
竹之内優希
田尻有沙
谷口和歌子
千々岩聡真
手島凜
鳥越友菜
中尾桃瀬
野口朗央
福岡比菜
松崎菜々実
松永紗和
真子大輝
南妃香莉
宮園晴日
森山海莉
劉沢寧
渡辺颯香
足立実優
池田阜弥
井上朋美
宇野日菜
上瀧桃子
茂山和寛
髙嶋莉彩
橘彩以
田中さゆり
田村宥奈
徳永歩乃佳
轟はなの
庭瀬美来
橋本音花
若狭映那
STAFF
専任教員一覧
伊藤敬生
井上貢一
井上友子
岩田敦之
桜井祐
永嶋さゆり
北島己佐吉
OBOG
2023年度卒業生
2022年度卒業生
2021年度卒業生
2020年度卒業生
2019年度卒業生
SESSION
専門科目一覧
ソーシャルデザイン概論
ソーシャルデザイン演習
情報デザイン演習IIA
情報デザイン演習IIB
地域ブランド企画演習IIA
地域ブランド企画演習IIB
視覚デザイン演習
Webデザイン演習
3DCG演習
情報デザイン研究I
地域ブランド企画研究I
卒業研究
教務ガイダンス
RecommendedVideo
BasicKnowledge
PROJECT
LINKS
SEARCH
開始行:
*Ghost
福岡市をGraffittiで塗りつぶしたギャラリーサイト
#image(FV.jpg)
-''Project Director''
-'''Keywords:Graffiti, Web, '''
~
**Overview
***Introduction / What is This
//&color(red){これは何か・・を簡潔に};//
-福岡市内の店の名前や看板などに落書きしたかのように見える...
~
***Background and Purpose
//&color(red){プロジェクトの背景と目的};//
-世間のグラフィティへの評価が低い
-たくさんの人にグラフィティに対する新しい表現の仕方や新し...
~
***Concept
//&color(red){基本的な考え方、枠組み、視点など};//
-描いていくグラフィティはデジタルで公共的なサインやロゴを...
-グラフィティを見せる事によってグラフィティに対しての新た...
-インターネットを利用してグラフィティをアートと認知してい...
~
***Output
//&color(red){成果物の直接掲載またはリンク誘導};//
//&color(red){&small(プロジェクトの途上では、試作品等、視...
//&color(red){&small(成果物の形式・サイズ・時間尺等の基本...
--[[撮影リスト>https://drive.google.com/file/d/1cPnv-ewnI...
-加工済みの写真30枚程度
--[[合成写真一覧>https://drive.google.com/drive/folders/1...
--[[写真一覧>https://drive.google.com/drive/folders/1dAVW...
-webサイト
-http://miyabi.om1002.coreserver.jp/
--[[ロゴデザイン>https://drive.google.com/file/d/1eOwq5pI...
--[[web_デザインカンプ(仮)>https://drive.google.com/drive...
--[[web_サイトマップ>https://drive.google.com/file/d/1_VT...
~
***Tools
//&color(red){使用するツール|ハードウエア・ソフトウエア}...
-Photoshop
-Illustrator
-Dreamweaver
-Procreate
-Filezilla
~
***Term
//&color(red){プロジェクトの期間|20XX.XX.XX - 20XX.XX.XX...
-2021.05.07-2022.12.03
~
***Conclusion / Summary
//&color(red){プロジェクトが完結したら「まとめ」を記載し...
~
~
**Survey
***Present Status
//&color(red){現状調査、現状の問題の洗い出し};//
-[[コロナ禍で落書きが急増? なぜ落書きするのか、その心理...
-[[平成 28 年度落書き消去活動アンケート報告>https://www.c...
-[[STOP 方法はあります!~落書きゼロのまちをめざして~>http...
~
***Precedent
//&color(red){先行事例の紹介、傾向分析など};//
***参考サイト
-https://in-art.jp/
-https://io3000.com/category/colors/white/
-https://www.id-frontier.jp/
-https://pin.it/SfYPZwe
~
***カンプ参考サイト
-https://siiimple.com/
-https://io3000.com/
-https://mindsparklemag.com/website/favelagrafia/
-https://dribbble.com/shots/5342869-BeVideo/attachments/1...
~
***Technique / Technology
//&color(red){プロジェクトの遂行に必要な技法・技術に関す...
-写真
--[[背景の撮影方法>https://ichi-up.net/2018/034]]
--[[【Photoshop】「レイヤー効果」だけで超簡単に文字や画像...
--[[Photoshopで写真を壁に描いたように加工する方法>https:/...
~
-web
--[[【CSS】超簡単!スクロールしても背景画像が固定されたま...
~
~
**Project Management
***Schedule
//&color(red){計画的な遂行のために、進行管理表を作成して...
-[[スケジュール>https://docs.google.com/spreadsheets/d/1v...
~
***ToDo
//&color(red){やるべきこと(タスク)を箇条書きにします。}...
//&color(red){完了後は「%%取り消し線%%」あるいは「// コメ...
-素材撮影
-グラフィティ制作
%%企画立案%%
%%サイトマップ制作%%
%%ワイヤーフレーム制作%%
-デザイン制作
-コーディング
~
~
~
#hr
CENTER:''worklog''
//&color(red){最新の情報を一番上に記載して下さい(古い記...
#hr
~
~
**2021.08.24
***調査
***css
-[[margin:0 autoを解説。効かないときの修正方法・代替案>ht...
-[[Flexboxより簡単に複雑なレイアウトが組める「Grid」>http...
-[[中央に配置する>https://www.w3.org/Style/Examples/007/c...
-[[justify-content>https://developer.mozilla.org/ja/docs/...
~
**2021.08.21
***調査
***viewport
-[[【初心者向け】 vh と vw の特徴と % との違いについて>ht...
-[[【CSS】vw、vh、vmin、vmaxとは?基本的な使い方>https://...
~
***cssボタン
-[[CSSボタンデザイン120個以上!どこよりも詳しく作り方を解...
-[[alt属性とは?>https://digitalidentity.co.jp/blog/seo/l...
-[[CSS入門:img画像のスタイルを整える方法>https://proengi...
~
**2021.08.18
***調査
***レスポンシブデザイン
-[[【2021年1月】スマホ用Webデザインはこのアートボードサイ...
-[[レスポンシブデザインの参考事例探しに最適なサイトを総ま...
-[[レスポンシブ対応のフォントサイズを指定>https://coliss....
-[[スマホデザインのフォントサイズの基準は?目安となる国内...
~
***メディアクエリ
-[[CSSのメディアクエリ(@media)クエリについて解説!>https:...
~
***ウィンドウサイズに合わせる
-[[フォントサイズを可変にしてみよう!css関数clampの便利な...
-[[CSSで背景画像をウィンドウサイズに合わせて表示したい>ht...
~
***[[Swiper>https://swiperjs.com/]]
-[[少しずつ画像が変化する、スライダーの作り方解説!>https...
~
~
**2021.08.16
***調査
***[[Swiper>https://swiperjs.com/]]
-フルスクリーンでスライドショーを入れる方法
--[[初心者向け!スライダー実装!JavaScriptの有名なスライ...
--[[Swiperでスライドさせる画像サイズカスタマイズ!上手い...
--[[スライダーの上に文字を固定で表示させる方法!Swiperで...
--[[スライダーのページネーションやナビゲーション(左右の...
~
***リセットCSS
-[[【コピペで出来る】おすすめのリセットCSSと使い方を解説...
~
***HTMLでjavaを読み込む
-[[今すぐ覚えられる!HTMLでJavaScriptを読み込む(呼び出す...
~
~
**2021.07.24
***調査
-[[今更聞けない!エンジニアのための CSS の基礎講座 〜ボッ...
~
**2021.07.16
***調査
***コーディング
-[[Web制作におけるCSSで単位や値を使った設定まとめ>https:/...
~
***撮影
-[[【初心者向け】風景写真をキレイに撮影する7つのコツ!>ht...
-[[初心者向けにカメラ設定の基本を完全ガイド!>https://www...
-[[Lesson8:ISO感度をマスターしよう>https://www.nikon-ima...
-[[Lesson21:最適な「絞り」の見つけかた>https://www.nikon...
-[[デジタル一眼カメラ α(アルファ)で写真撮影を楽しむ>htt...
-[[ピントがうまく合わない(α:アルファ:Eマウント)>https...
~
**2021.07.07
***制作
***コーディング
-[[web_コーディング>https://drive.google.com/drive/folder...
~
***調査
***html/css
-[[CSSでtext-alignを使って文字を配置する方法【初心者向け...
-[[positionプロパティを身に着けよう!基本的な知識と使い方...
-[[positionプロパティを身に着けよう!基本的な知識と使い方...
-[[[CSS]背景画像をブラウザいっぱいに表示するシンプルな最...
-[[【入門】レスポンシブWebデザインとは?概要と作り方を丁...
-[[CSS - @media>https://www.tohoho-web.com/css/rule/media...
-[[CSS|背景画像の上に背景色を重ねる方法>https://cotodama...
-[[お勧めなCSSスライド式サイドバー9選>https://www.seleqt...
-[[【コーディング例あり】模写コーディングのやり方【手順を...
-[[jQueryを使わずにスライドメニューを実装しよう>https://w...
-[[CSSだけでサイドバーを固定・スクロール追従する方法(Jav...
-[[【jQuery】ドロワーメニュー 横からスライド表示するメニ...
**2021.07.06
***調査
***html/css
-[[そもそも親要素・子要素ってなんだ ~トランスペアレント...
-[[スタイルシート(CSS)の基本的な書き方【初心者向け】>ht...
-[[誰でも簡単にできる!HTMLで文字の色を指定する方法【初心...
-[[【次のページへ移動するには?】HTMLのリンクがよくわかる...
-[[ 【2021年版】font-familyの正しい指定方法・タイプ別おす...
-[[1本だけ線を引くCSS>https://www.nishishi.com/css/line-b...
-[[font-size …… フォントのサイズを指定する>http://www.htm...
-[[【CSS】borderの長さを調整する方法3つ:文字に応じて可変...
-[[表示位置を変えたい!CSSでpositionの使い方【初心者向け...
~
**2021.07.02
***制作
***コーディング
-[[web_コーディング>https://drive.google.com/drive/folder...
~
***調査
***html/css
-[[シングルページの作り方は?メリットとテンプレートを紹介...
-[[【永久保存版】デザイン初心者でも美しいサイトが作れる!...
-[[テンプレートNo.001タイプのマニュアル>https://f-tpl.com...
-[[ナビメニュー100連発!CSSで表現できるコピペ可能なHTMLス...
-[[3分で丸わかり!HTMLで画像をリンクにする簡単な方法とは>...
-[[HTML・CSSで背景画像を画面いっぱいに全画面表示する方法...
-[[【HTML div】divタグとは?使い方を基礎から徹底解説|HTM...
***webフォント
-[[【まとめ】Webフォントの使い方!完全ガイド 初級編【202...
***解像度
-[[Photoshopでjpgのdpiを指定して書き出す方法とjpgの解像度...
-[[WebデザインやSEOを向上させる画像最適化の方法とは?>htt...
~
**2021.06.25
***制作
***ロゴ制作
-[[ロゴデザイン>https://drive.google.com/file/d/1eOwq5pIi...
~
***更新
-[[web_デザインカンプ(仮)>https://drive.google.com/drive/...
~
***調査
-[[現役デザイナーが解説!フッターデザインの参考事例と注意...
-[[I/O 3000>https://io3000.com/]]
-[[Pinterest>https://www.pinterest.jp/]]
~
**2021.06.17
***制作
|#image(4.jpg)|
~
-[[加工写真>https://drive.google.com/drive/folders/1KjFBG...
-[[撮影写真一覧>https://drive.google.com/drive/folders/1a...
***調査
-[[【Photoshop】「レイヤー効果」だけで超簡単に文字や画像...
-[[Photoshopで写真を壁に描いたように加工する方法>https://...
~
**2021.06.16
***制作
***ロゴ制作
-[[web_ロゴ>https://drive.google.com/file/d/1VrGHp04E85n9...
***更新
-[[web_デザインカンプ(仮)>https://drive.google.com/file/d...
~
**2021.06.15
***タイトル決め
-Ghost
-意味:実際には存在しない架空の写真を載せるから
~
***制作
-[[web_デザインカンプ(仮)>https://drive.google.com/drive/...
-[[web_ワイヤーフレーム(仮)>https://drive.google.com/driv...
-[[web_サイトマップ(仮)>https://drive.google.com/file/d/1...
~
***調査
***サイトマップ
-[[Webサイト制作で参考になるサイトマップのデザインまとめ>...
~
***ワイヤーフレーム
-[[WEBデザインでよく聞く「カラム」について>https://www.at...
-[[HP作成の初心者でワイヤーフレームの作り方をよく知らない...
-[[ワイヤーフレームの作り方完全ガイド【サンプル付き】>htt...
~
***デザインカンプ
-[[【見本あり】デザインカンプの作り方とコツを現役webデザ...
-[[【かんたん】デザインカンプの作り方、0から丁寧にわかり...
-[[Webサイトにおける文章を読みやすくするデザインのポイン...
-[[デザインから感じる「印象」を詳しく解説!企業イメージを...
~
***タイトル決め
-[[事例に学ぶ!集客できるサイト名の決め方と9つのポイント...
~
***参考webデザイン集
-https://liginc.co.jp/416443
~
~
**2021.05.19
***制作
|#image(3.jpg)|
***調査
***ギャラリーサイト集
-https://andspace.net/blog/sitemap/
***サイトマップの作り方
-https://andspace.net/blog/sitemap/
~
**2021.05.12
***テーマ案
-福岡市の街の標識や看板をグラフィティ化した写真を載せるサ...
~
***試作
|49|2|49|c
|#image(1.jpg)| |#image(2.jpg)|
**2021.05.11
***グラフィティとは
-グラフィティ (graffiti) は、エアロゾールアート (aerosol ...
~
-語源はイタリア語の「graffio」からきていて、“引っかくこと...
~
***グラフィティの歴史
***1800年代
-1800年代後半にはアメリカでBozo Texinoと鉄道員たちが工業...
~
***1900年代
-第2次世界大戦中と終戦後の1940年辺りは、坊主頭と長い鼻の...
~
-1960年代に入ると、55年に亡くなったジャズ界のサックスフォ...
~
-1970年代にニューヨークのダウンタウンで始まったとされ、ス...
~
-70年初頭、グラフィティムーブメントの中心はフィラデルフィ...
~
-1980年代には、ダウンタウンの黒人文化とされていたNYのグラ...
~
***グラフィティの種類(描き方)
-タグ(tag)
--グラフィティライターの名前やサインのこと。
~
-スローアップ(throw-up)
--2色ほどで書かれ、アウトラインで構成されたもの。
~
-ブロックバスタ(Block Buster)
--ブロック状の文字で書かれた巨大なグラフィティ。短時間で...
~
-ピース(Piece)
--3色以上使い、タグまで添えられたものなど、完成されたグラ...
~
-ワイルドスタイル(Wild Style)
--巧妙なスローアップで、複雑に組み合わされたものなので、...
~
~
***参照リンク
-[[グラフィティの歴史や書き方を画像で解説!アーティストも...
-[[wiki>https://ja.wikipedia.org/wiki/%E3%82%B0%E3%83%A9%...
-[[ヒップホップのグラフィティカルチャー、古代からNYへの壮...
**2021.05.06
***テーマ案
-ロゴ×塗りつぶす
~
-有名ブランドのロゴをグラフィティ風に制作したものを載せる...
-ロゴのデザインの重要性、グラフィティのかっこよさを伝える...
~
***参考リンク
-[[マッシュアップしたロゴデザインの比較サイト>https://blo...
-[[logo制作>https://pin.it/3H6zB1j]]
~
**2021.04.22
***テーマ案
-グラフィティ×webサイト
--自分で好みのグラフィティをカスタマイズできるサイト
~
***参考リンク
-[[野村麗奈/卒業研究Ⅰ>http://design.kyusan-u.ac.jp/social...
-[[アイコンメーカー>http://furrytail.sakura.ne.jp/ext/ico...
-[[キャラクターメイカー>https://picrew.me/]]
***既存サイト
-[[有料グラフィティ変換サイト>https://www.graffiticreator...
-[[無料グラフィティ変換サイト>https://fontmeme.com/ja/fon...
-[[テキストデザイン変換サイト1>https://fontmeme.com/ja/fo...
-[[テキストデザイン変換サイト2>https://ja.cooltext.com]]
~
**2021.04.20
***テーマ再考
***参考リンク
-[[神戸アートビレッジセンター>https://www.kavc.or.jp/repo...
-[[ゴミがアート作品に!ある産廃処理業者の挑戦が集めた予想...
~
**2021.04.16
***テーマ案
-落書き問題×Graphic design&web design
--福岡市のリーガルウォールを設置した体験型の架空の店のDTP...
~
***参考リンク
-[[水戸のリーガルウォール>http://www.asahi-net.or.jp/~up5...
-[[大阪のリーガルウォール>https://www.wallshare-inc.com/]]
~
終了行:
*Ghost
福岡市をGraffittiで塗りつぶしたギャラリーサイト
#image(FV.jpg)
-''Project Director''
-'''Keywords:Graffiti, Web, '''
~
**Overview
***Introduction / What is This
//&color(red){これは何か・・を簡潔に};//
-福岡市内の店の名前や看板などに落書きしたかのように見える...
~
***Background and Purpose
//&color(red){プロジェクトの背景と目的};//
-世間のグラフィティへの評価が低い
-たくさんの人にグラフィティに対する新しい表現の仕方や新し...
~
***Concept
//&color(red){基本的な考え方、枠組み、視点など};//
-描いていくグラフィティはデジタルで公共的なサインやロゴを...
-グラフィティを見せる事によってグラフィティに対しての新た...
-インターネットを利用してグラフィティをアートと認知してい...
~
***Output
//&color(red){成果物の直接掲載またはリンク誘導};//
//&color(red){&small(プロジェクトの途上では、試作品等、視...
//&color(red){&small(成果物の形式・サイズ・時間尺等の基本...
--[[撮影リスト>https://drive.google.com/file/d/1cPnv-ewnI...
-加工済みの写真30枚程度
--[[合成写真一覧>https://drive.google.com/drive/folders/1...
--[[写真一覧>https://drive.google.com/drive/folders/1dAVW...
-webサイト
-http://miyabi.om1002.coreserver.jp/
--[[ロゴデザイン>https://drive.google.com/file/d/1eOwq5pI...
--[[web_デザインカンプ(仮)>https://drive.google.com/drive...
--[[web_サイトマップ>https://drive.google.com/file/d/1_VT...
~
***Tools
//&color(red){使用するツール|ハードウエア・ソフトウエア}...
-Photoshop
-Illustrator
-Dreamweaver
-Procreate
-Filezilla
~
***Term
//&color(red){プロジェクトの期間|20XX.XX.XX - 20XX.XX.XX...
-2021.05.07-2022.12.03
~
***Conclusion / Summary
//&color(red){プロジェクトが完結したら「まとめ」を記載し...
~
~
**Survey
***Present Status
//&color(red){現状調査、現状の問題の洗い出し};//
-[[コロナ禍で落書きが急増? なぜ落書きするのか、その心理...
-[[平成 28 年度落書き消去活動アンケート報告>https://www.c...
-[[STOP 方法はあります!~落書きゼロのまちをめざして~>http...
~
***Precedent
//&color(red){先行事例の紹介、傾向分析など};//
***参考サイト
-https://in-art.jp/
-https://io3000.com/category/colors/white/
-https://www.id-frontier.jp/
-https://pin.it/SfYPZwe
~
***カンプ参考サイト
-https://siiimple.com/
-https://io3000.com/
-https://mindsparklemag.com/website/favelagrafia/
-https://dribbble.com/shots/5342869-BeVideo/attachments/1...
~
***Technique / Technology
//&color(red){プロジェクトの遂行に必要な技法・技術に関す...
-写真
--[[背景の撮影方法>https://ichi-up.net/2018/034]]
--[[【Photoshop】「レイヤー効果」だけで超簡単に文字や画像...
--[[Photoshopで写真を壁に描いたように加工する方法>https:/...
~
-web
--[[【CSS】超簡単!スクロールしても背景画像が固定されたま...
~
~
**Project Management
***Schedule
//&color(red){計画的な遂行のために、進行管理表を作成して...
-[[スケジュール>https://docs.google.com/spreadsheets/d/1v...
~
***ToDo
//&color(red){やるべきこと(タスク)を箇条書きにします。}...
//&color(red){完了後は「%%取り消し線%%」あるいは「// コメ...
-素材撮影
-グラフィティ制作
%%企画立案%%
%%サイトマップ制作%%
%%ワイヤーフレーム制作%%
-デザイン制作
-コーディング
~
~
~
#hr
CENTER:''worklog''
//&color(red){最新の情報を一番上に記載して下さい(古い記...
#hr
~
~
**2021.08.24
***調査
***css
-[[margin:0 autoを解説。効かないときの修正方法・代替案>ht...
-[[Flexboxより簡単に複雑なレイアウトが組める「Grid」>http...
-[[中央に配置する>https://www.w3.org/Style/Examples/007/c...
-[[justify-content>https://developer.mozilla.org/ja/docs/...
~
**2021.08.21
***調査
***viewport
-[[【初心者向け】 vh と vw の特徴と % との違いについて>ht...
-[[【CSS】vw、vh、vmin、vmaxとは?基本的な使い方>https://...
~
***cssボタン
-[[CSSボタンデザイン120個以上!どこよりも詳しく作り方を解...
-[[alt属性とは?>https://digitalidentity.co.jp/blog/seo/l...
-[[CSS入門:img画像のスタイルを整える方法>https://proengi...
~
**2021.08.18
***調査
***レスポンシブデザイン
-[[【2021年1月】スマホ用Webデザインはこのアートボードサイ...
-[[レスポンシブデザインの参考事例探しに最適なサイトを総ま...
-[[レスポンシブ対応のフォントサイズを指定>https://coliss....
-[[スマホデザインのフォントサイズの基準は?目安となる国内...
~
***メディアクエリ
-[[CSSのメディアクエリ(@media)クエリについて解説!>https:...
~
***ウィンドウサイズに合わせる
-[[フォントサイズを可変にしてみよう!css関数clampの便利な...
-[[CSSで背景画像をウィンドウサイズに合わせて表示したい>ht...
~
***[[Swiper>https://swiperjs.com/]]
-[[少しずつ画像が変化する、スライダーの作り方解説!>https...
~
~
**2021.08.16
***調査
***[[Swiper>https://swiperjs.com/]]
-フルスクリーンでスライドショーを入れる方法
--[[初心者向け!スライダー実装!JavaScriptの有名なスライ...
--[[Swiperでスライドさせる画像サイズカスタマイズ!上手い...
--[[スライダーの上に文字を固定で表示させる方法!Swiperで...
--[[スライダーのページネーションやナビゲーション(左右の...
~
***リセットCSS
-[[【コピペで出来る】おすすめのリセットCSSと使い方を解説...
~
***HTMLでjavaを読み込む
-[[今すぐ覚えられる!HTMLでJavaScriptを読み込む(呼び出す...
~
~
**2021.07.24
***調査
-[[今更聞けない!エンジニアのための CSS の基礎講座 〜ボッ...
~
**2021.07.16
***調査
***コーディング
-[[Web制作におけるCSSで単位や値を使った設定まとめ>https:/...
~
***撮影
-[[【初心者向け】風景写真をキレイに撮影する7つのコツ!>ht...
-[[初心者向けにカメラ設定の基本を完全ガイド!>https://www...
-[[Lesson8:ISO感度をマスターしよう>https://www.nikon-ima...
-[[Lesson21:最適な「絞り」の見つけかた>https://www.nikon...
-[[デジタル一眼カメラ α(アルファ)で写真撮影を楽しむ>htt...
-[[ピントがうまく合わない(α:アルファ:Eマウント)>https...
~
**2021.07.07
***制作
***コーディング
-[[web_コーディング>https://drive.google.com/drive/folder...
~
***調査
***html/css
-[[CSSでtext-alignを使って文字を配置する方法【初心者向け...
-[[positionプロパティを身に着けよう!基本的な知識と使い方...
-[[positionプロパティを身に着けよう!基本的な知識と使い方...
-[[[CSS]背景画像をブラウザいっぱいに表示するシンプルな最...
-[[【入門】レスポンシブWebデザインとは?概要と作り方を丁...
-[[CSS - @media>https://www.tohoho-web.com/css/rule/media...
-[[CSS|背景画像の上に背景色を重ねる方法>https://cotodama...
-[[お勧めなCSSスライド式サイドバー9選>https://www.seleqt...
-[[【コーディング例あり】模写コーディングのやり方【手順を...
-[[jQueryを使わずにスライドメニューを実装しよう>https://w...
-[[CSSだけでサイドバーを固定・スクロール追従する方法(Jav...
-[[【jQuery】ドロワーメニュー 横からスライド表示するメニ...
**2021.07.06
***調査
***html/css
-[[そもそも親要素・子要素ってなんだ ~トランスペアレント...
-[[スタイルシート(CSS)の基本的な書き方【初心者向け】>ht...
-[[誰でも簡単にできる!HTMLで文字の色を指定する方法【初心...
-[[【次のページへ移動するには?】HTMLのリンクがよくわかる...
-[[ 【2021年版】font-familyの正しい指定方法・タイプ別おす...
-[[1本だけ線を引くCSS>https://www.nishishi.com/css/line-b...
-[[font-size …… フォントのサイズを指定する>http://www.htm...
-[[【CSS】borderの長さを調整する方法3つ:文字に応じて可変...
-[[表示位置を変えたい!CSSでpositionの使い方【初心者向け...
~
**2021.07.02
***制作
***コーディング
-[[web_コーディング>https://drive.google.com/drive/folder...
~
***調査
***html/css
-[[シングルページの作り方は?メリットとテンプレートを紹介...
-[[【永久保存版】デザイン初心者でも美しいサイトが作れる!...
-[[テンプレートNo.001タイプのマニュアル>https://f-tpl.com...
-[[ナビメニュー100連発!CSSで表現できるコピペ可能なHTMLス...
-[[3分で丸わかり!HTMLで画像をリンクにする簡単な方法とは>...
-[[HTML・CSSで背景画像を画面いっぱいに全画面表示する方法...
-[[【HTML div】divタグとは?使い方を基礎から徹底解説|HTM...
***webフォント
-[[【まとめ】Webフォントの使い方!完全ガイド 初級編【202...
***解像度
-[[Photoshopでjpgのdpiを指定して書き出す方法とjpgの解像度...
-[[WebデザインやSEOを向上させる画像最適化の方法とは?>htt...
~
**2021.06.25
***制作
***ロゴ制作
-[[ロゴデザイン>https://drive.google.com/file/d/1eOwq5pIi...
~
***更新
-[[web_デザインカンプ(仮)>https://drive.google.com/drive/...
~
***調査
-[[現役デザイナーが解説!フッターデザインの参考事例と注意...
-[[I/O 3000>https://io3000.com/]]
-[[Pinterest>https://www.pinterest.jp/]]
~
**2021.06.17
***制作
|#image(4.jpg)|
~
-[[加工写真>https://drive.google.com/drive/folders/1KjFBG...
-[[撮影写真一覧>https://drive.google.com/drive/folders/1a...
***調査
-[[【Photoshop】「レイヤー効果」だけで超簡単に文字や画像...
-[[Photoshopで写真を壁に描いたように加工する方法>https://...
~
**2021.06.16
***制作
***ロゴ制作
-[[web_ロゴ>https://drive.google.com/file/d/1VrGHp04E85n9...
***更新
-[[web_デザインカンプ(仮)>https://drive.google.com/file/d...
~
**2021.06.15
***タイトル決め
-Ghost
-意味:実際には存在しない架空の写真を載せるから
~
***制作
-[[web_デザインカンプ(仮)>https://drive.google.com/drive/...
-[[web_ワイヤーフレーム(仮)>https://drive.google.com/driv...
-[[web_サイトマップ(仮)>https://drive.google.com/file/d/1...
~
***調査
***サイトマップ
-[[Webサイト制作で参考になるサイトマップのデザインまとめ>...
~
***ワイヤーフレーム
-[[WEBデザインでよく聞く「カラム」について>https://www.at...
-[[HP作成の初心者でワイヤーフレームの作り方をよく知らない...
-[[ワイヤーフレームの作り方完全ガイド【サンプル付き】>htt...
~
***デザインカンプ
-[[【見本あり】デザインカンプの作り方とコツを現役webデザ...
-[[【かんたん】デザインカンプの作り方、0から丁寧にわかり...
-[[Webサイトにおける文章を読みやすくするデザインのポイン...
-[[デザインから感じる「印象」を詳しく解説!企業イメージを...
~
***タイトル決め
-[[事例に学ぶ!集客できるサイト名の決め方と9つのポイント...
~
***参考webデザイン集
-https://liginc.co.jp/416443
~
~
**2021.05.19
***制作
|#image(3.jpg)|
***調査
***ギャラリーサイト集
-https://andspace.net/blog/sitemap/
***サイトマップの作り方
-https://andspace.net/blog/sitemap/
~
**2021.05.12
***テーマ案
-福岡市の街の標識や看板をグラフィティ化した写真を載せるサ...
~
***試作
|49|2|49|c
|#image(1.jpg)| |#image(2.jpg)|
**2021.05.11
***グラフィティとは
-グラフィティ (graffiti) は、エアロゾールアート (aerosol ...
~
-語源はイタリア語の「graffio」からきていて、“引っかくこと...
~
***グラフィティの歴史
***1800年代
-1800年代後半にはアメリカでBozo Texinoと鉄道員たちが工業...
~
***1900年代
-第2次世界大戦中と終戦後の1940年辺りは、坊主頭と長い鼻の...
~
-1960年代に入ると、55年に亡くなったジャズ界のサックスフォ...
~
-1970年代にニューヨークのダウンタウンで始まったとされ、ス...
~
-70年初頭、グラフィティムーブメントの中心はフィラデルフィ...
~
-1980年代には、ダウンタウンの黒人文化とされていたNYのグラ...
~
***グラフィティの種類(描き方)
-タグ(tag)
--グラフィティライターの名前やサインのこと。
~
-スローアップ(throw-up)
--2色ほどで書かれ、アウトラインで構成されたもの。
~
-ブロックバスタ(Block Buster)
--ブロック状の文字で書かれた巨大なグラフィティ。短時間で...
~
-ピース(Piece)
--3色以上使い、タグまで添えられたものなど、完成されたグラ...
~
-ワイルドスタイル(Wild Style)
--巧妙なスローアップで、複雑に組み合わされたものなので、...
~
~
***参照リンク
-[[グラフィティの歴史や書き方を画像で解説!アーティストも...
-[[wiki>https://ja.wikipedia.org/wiki/%E3%82%B0%E3%83%A9%...
-[[ヒップホップのグラフィティカルチャー、古代からNYへの壮...
**2021.05.06
***テーマ案
-ロゴ×塗りつぶす
~
-有名ブランドのロゴをグラフィティ風に制作したものを載せる...
-ロゴのデザインの重要性、グラフィティのかっこよさを伝える...
~
***参考リンク
-[[マッシュアップしたロゴデザインの比較サイト>https://blo...
-[[logo制作>https://pin.it/3H6zB1j]]
~
**2021.04.22
***テーマ案
-グラフィティ×webサイト
--自分で好みのグラフィティをカスタマイズできるサイト
~
***参考リンク
-[[野村麗奈/卒業研究Ⅰ>http://design.kyusan-u.ac.jp/social...
-[[アイコンメーカー>http://furrytail.sakura.ne.jp/ext/ico...
-[[キャラクターメイカー>https://picrew.me/]]
***既存サイト
-[[有料グラフィティ変換サイト>https://www.graffiticreator...
-[[無料グラフィティ変換サイト>https://fontmeme.com/ja/fon...
-[[テキストデザイン変換サイト1>https://fontmeme.com/ja/fo...
-[[テキストデザイン変換サイト2>https://ja.cooltext.com]]
~
**2021.04.20
***テーマ再考
***参考リンク
-[[神戸アートビレッジセンター>https://www.kavc.or.jp/repo...
-[[ゴミがアート作品に!ある産廃処理業者の挑戦が集めた予想...
~
**2021.04.16
***テーマ案
-落書き問題×Graphic design&web design
--福岡市のリーガルウォールを設置した体験型の架空の店のDTP...
~
***参考リンク
-[[水戸のリーガルウォール>http://www.asahi-net.or.jp/~up5...
-[[大阪のリーガルウォール>https://www.wallshare-inc.com/]]
~
ページ名: