インターン⑥ CMS編
こんにちは！
先日、インターン6回目に行ってきました。
今回からCMSに入りました。
CMSとは、HTMLやCSSのようなWebサイトの制作に必要な専門知識を必要とせず、テキストや画像などの情報を入力するだけで、サイト構築を自動的に行うことが出来るシステムのことです。CMSを導入することで、Webページの作成や更新を簡単に行うことでき、初心者でもWebサイトを運用することができます。
HTML、CSSに続き3つ目ともなってくると「なんかまた新しいのでてきたけどやっていくうちにわかるようになるかぁ」みたいな気持ちになってきました。(ですので、現段階ではほとんどよくわかっていません。)
初心者でも運用しやすいという所だけに希望をもって頑張ろうと思います。笑
メリット
プログラミングの知識が不要という上に、全てブラウザ上で操作が可能ということが私は嬉しかったです。
HTMLやCSSを組み合わせてサイトを作るとなるとパソコン上で4画面を駆使しながら作っていかなければならないし、反映されているかどうかいちいちチェックしなくてはなりませんでした。しかし、CMSは入力するだけで勝手に反映されるとの事なので私が今までブログに書いてきた手間暇がかかる〜とか画面ごちゃごちゃしてる〜とかが一気に解決されました。
デメリット
やはり使用するCMSによって仕組みなどが異なるため、初期段階でのある程度の知識や慣れが必要になるそうです。
その中でも私たちが使用するのはWordPressというものです。
WordPressはCMSの中でも誰でも無料で使えるという観点から最も多くのシェアを誇っており、世界中で使われているそうです。
WordPress内ではテーマを統一することができますが、そのテーマに合わせて自分が編集するという能力も必要になります。
まずは自分が書きたいことを練習用としてWordPressをいじることが課題として出されたのでとりあえずやってみようと思います。
進み次第、また更新しようと思います〜。
インターン⑤ CSS編その2
こんにちは！
先日インターン5回目に行ってきました。
今回は最初に同じインターンメンバーの先輩からプレゼンをして頂きました。
美術館や美術作品が好きということで、インターンを通して感じたことや学んだことを作品を例にしての発表がとても印象的でした。
そして、前回に引き続きCSSに入りました。
今回は主にCSSでグリッドを作っていきました。
グリッドとはこのスライドにもあるように画面上に表示される格子状の線のことをいいます。デザインで余白やレイアウトを統一するために設定したり、画像や文字を配置するときの目安に使用したりします。
実際に福岡大学のホームページでもグリッドを使用して画像や文字を配置して統一感を出すような工夫がされていたり、YouTubeなどの有名サイトにも使用されているとのことでした。
グリッドのお話を聞きながら、このことを知るだけでなんか見方変わってくるな〜と思いました。
そして実際にHTMLとCSSを組み合わせてグリッドを作ってみました。
こちらが私がつくったものです。
すごく単純なものにみえますが、ここまでで軽く1時間以上はかかりました…。
ちなみにコードはこんな感じになってます。
HTML
※CSSはこんなもんではありません。
サイトを見やすくするだけで、こんなにも手間暇がかかるんだと驚きました。改めてプログラミングやっている人はすごいなぁ〜と。
5月から実際にサイトを作る仕事が始まるそうですが、できる気がしないです…。
最後に、レスポンシブのお話をして頂きました。
レスポンシブデザインとはどんな大きさの画面でも見やすく表示するためのものです。(スマホ、タブレット、PCなど)
内容(HTML)は全て同じだけど見せ方(CSS)を変えるということです。
レスポンシブデザインに対応することで、検索の上位にきやすくなるというのがメリットの1つとして挙げられます。実際にGoogleがこれに対応していないサイトは検索順位を下げるという発表をして、多くの企業がスマホ対応のサイトを制作したそうです。
「だから君たちもレスポンシブデザインは当たり前にしてもらうことになるよ〜」
と池田さんがおっしゃっていたので、また更に不安になりましたがとりあえずやってみようと思いました。
今回はこの辺で。
インターン④ CSSはじまりました
こんにちは！
今回は14日に行われたインターンのことについて書いていこうと思います！
今回もタイピングから始まりましたが、なんと呼び方がブラインドタッチからタッチタイピングに変わりました。(というよりは変わっていた)
早く打つスピード×正確さがまだどっちかに偏ってしまっているので、完璧にマスターできるように頑張ります！
そして、今回からCSSに入りました。
このようにHTMLはページの中身、CSSはその部分ごとに全体のスタイルを決めるという役割の違いがあります。
説明だけじゃピンとこなかったので、福大のホームページで例を池田さんが説明してくださいました。
ここで私は文字とか画像とか主な内容がHTMLで、CSSがページを見やすくするためのものなんだと理解しました。(遅い)
CSSの基本形はセレクタ・プロパティ・値を大かっことコロン、セミコロンを組み合わせることで成り立ちます。
・セレクタとは変える部分のこと→HTML内で指定する
・プロパティはセレクタの何を変えるか→色とか大きさとか位置とか
・値はプロパティをどうするか
なるほどなるほど。分かってきたぞ。
続いて、実践練習を何個かやりました。
ここまでは順調にいっていたのですが、最後の問題でつまずきました…
最後の問題⤵︎ ︎
これは押すとリンク先に飛ぶようなボタンをつくるというものなのですが、この通りに打ち込むだけなのに全くできませんでした😭
最初はスペルミスとかコロンの忘れが見つかったのでちょこちょこ直していたのですが、それでも改善されず…池田さんにも見てもらっても原因不明でした。
仕方なくできている人のものをコピペして貼り付けようとしていたところ、突然反映されました。
どうやら、更新に時間がかかっていただけのようです😂😂 なんやねん！！！！！
感じたこと
①画面がごちゃごちゃして大変
これは私が上手くPC使えていないだけだと思うのですが、一気に4つのページを開いて作業したりするのでなにがどれだか分からず作業に遅れがでてしまいました。
マウス使ってやったほうが楽なのでしょうか…？
②基本形を崩さない
自分では完璧に打ち込んだつもりが1番怖いなと感じました。まだ使い始めたばかりで全然慣れていないので仕方ないとは思いますが、実際に企業の方とのインターンが始まったらこんな基本のミスで遅れを出したり、メンバーに迷惑かけたくないなと感じました。
とりあえず今回の課題のCSSをいじるというので自分なりに理解を深めて少しでも使いこなせるようにならないと…！！
今回はこの辺で！
東京研修② インフォバーン編
こんにちは！
更新遅くなってすみません！
今回は前回に引き続き研修で2社目に訪問したインフォバーンさんについて書いていこうと思います。
インフォバーンの田汲さんには以前にも福岡大学に来てお話をしていただきました。
今回も田汲さんからの広義の意味でのマーケティング（エンゲージメントを獲得する３つのステップ）のお話をしていただきました。
今回もだいぶくせが強かったです。笑
ちなみにエンゲージメントとはなんぞやかといいますと
エンゲージメント とは、企業や商品、ブランドなどに対して ユーザー が「愛着を持っている」状態を指す。わかりやすく言えば、企業とユーザーの「つながりの強さ」を表す用語。
田汲さんはこれを顔も知らない1人の男子高校生から学んだそうです。
①相手の話をよく聞く
→8対2くらいで聞き役になる。話を聞き相手の情報を引き出すことで、相手の属性を知る。
②嘘をつかない
→当たり前かと思いますが、田汲さんの場合は顔も知らない人に住所や勤務先まで教えていました。田汲さん曰く「自己紹介は情報の殴り合い」だそうです。それくらい本音でやり取りすることが大事ということだと思います。
③相手のツボをおさえる+ギャップを魅了する
→ターゲットに好みを合わせつつ、衝撃を与える。
仕事をしていく上で人間は結局感情で行動してしまう部分があるから、エンゲージメントを獲得しておくことで相手の選択肢のうちの１つに入れたり、予想もしないところでの縁につながったりもするのかなぁと思いました。
続いて、IDL（インフォバーンデザインラボ）の川田さんから事業のお話や、私たちがゼミで取り組んだUXデザインのことなどについてのお話がありました。
川田さんの職業はコンテンツストラテジストといいます。（初めてきいた）
コンテンツストラテジストとは、対外的に発信する情報の戦略担当のことをいう。
広義には、テレビCMや広報などの情報発信からウェブページ一つまでの全てを対象とした戦略家を指す。
主な仕事内容は、コンテンツをいつ、どこで、どのような形で、誰に対し、何を目的に配信するかの総合的な計画を立てることと、その実施・運用・更新を行うこと。
川田さんのお話で印象に残っているのは軸を持っていないということです。
仕事の大まかな目的はブランドの持つ価値を探し出すことにあります。しかし、これは私たちもミズノさんとのプロジェクトで判明したように提供する企業もそれを受け取る消費者も当事者自身が気づいていません。
ですので、
・購入のきっかけ
・購入の検討
・購入の直後
・商品が馴染んだ１ヶ月後
・完全に自分のものになった3ヶ月
といった一連の流れをコンテンツに関わらず全てを分析することで、引き出しをどんどん増やしていくことで成り立つ仕事なのです。
また、人によって使う言葉を変えて話のレベルを合わせることも大事だとおっしゃっていました。
まさに経験の積み重ねがものをいう仕事だなと感じました。普通に考えるとこういうのって積み重ねるごとに軸ができあがっていくものだと思ってしまうけど、仕事をするたびに新しい引き出しが増えてそれぞれに合わせていくというスタイルが新鮮で面白いなと感じました。
最後に、ゼミ生側からの発表とそれについてとアドバイスを頂きました。
Q.分析が上手くいかないのは観察不足か？
→観察不足というよりは観察対象を広げすぎている。なんでも広くとりすぎるとなんのために観察をしているのか分からくなってしまうので、どこを評価するかあらかじめチーム内ですり合わせておくことが大事。
Q.上手く言語化できない…
→同じことを3.4回繰り返すと何となくこういう感じというのがつかめる。絶対に共通言語がみつかる！
Q.偏見が邪魔をする
→とにかく話し合うしかない。人によって発見も違うから耳を傾ける努力をする。
Q.考えすぎて限定的な部分しか見えない
→悩みすぎたらとりあえず先に進んでみる。後から何かわかるかもしれない。分からないなら頼ってもOK！
「店舗観察はどうしても差異をみつけようとしがちだけど、トータルでみたらなにが共通しているかですよ！」
という川田さんのお言葉、ハッ！！とさせられました。珍しい人だけのデータ集めても共通言語見つからないの当たり前ですもんね。
お二人のお話を聞いて、またモヤモヤするのは目に見えているのになんかもう1回UXデザインをやってみたい！！という気持ちになりました。笑
とにかく取組むことも大事だけど、プレリサーチやチーム内でのすりあわせなどの準備のほうがなによりも大切だなと感じました。
それでは第2弾はこのへんで。
まだまだ続きます〜
東京研修① Google編
こんにちは！今回は2月22日～23日の森田ゼミ東京研修でのことを書いていこうと思います。
今回は3社訪問させて頂いたうちの1つ目、Googleさんのことについて書いていこうと思います！
Googleさんは六本木にあるこーんな高いビルの
こーんな景色が見えるところにあるのです！！
圧倒されまくりです…。
そんな世界一の企業Googleをとってもラフな格好の営業部の山下さんに案内して頂きました。
社内見学→Googleについて→質疑応答という流れで進んでいきました。
Googleの社内風景
会社の中ではなんといってもミーティングルームの多さが目を引きました。その全てにテレビ電話機能があり、毎週国際電話でアメリカなどの経営層トップの方とお話する機会があるのだそうです。オフィスにはフロアごとにテーマがあり、ミーティングルームの一つ一つに個性的な名前がついていました。(山の手線の駅名のフロアとかもあるらしい！)その多さは社員である山下さんも覚えられないほどで、会議のたびに場所を検索しているほどだそうです。笑 ちなみに私たちがお邪魔したフロアは日本らしい和風な感じがテーマらしいのですが、なぜかそのミーティングルームには「ちまき」と名付けられていました。笑 まぁ、それもちゃんと決めてるけどなんとなくGoogleっぽいよねとなって許されるみたいです。
その他にも一部屋入る事にセキュリティ認証が必要だったり、グローバルな企業だからこそ多国籍な社員さんがいたり、立って仕事をしてる人や、廊下でやってる人がいたり、社内にビリヤードやゲームをする場所があったりと社内風景だけで500文字くらい書けるほど印象的なオフィスでした。
Googleについて
続いて山下さんから Googleが扱っているコンテンツや今どんなことに取り組んでいるのか、働き方などを教えて頂きました。
・広告と機械学習
Googleは主に検索エンジンとして有名ですが、コンテンツを提供したり、それに伴うサービスを提供しているため一般的にはto C向けの企業だと思われがちですが、実は企業からの広告掲載料で成り立っています。
そんなGoogleさんは今「機械学習」というものに力をいれているそうです。機械学習とは、人間が自然に行っている学習能力と同様のことをコンピュータで実現させようとすることです。
よく自分が検索したことがインスタやYouTubeで流れてきてついつい見てしまう…ということがあると思います。
それらは全て機械に「この人はこういうことを検索する傾向にあるな」「これは○○なんだ」とういことを学ばせて、その人に必要な情報と傾向をつかませているのです。
これは広告なのか？とだましたり、広告だと気づかないほど自然にするのではなく、いかにユーザー個人に必要だと思われる広告を出せるかどうかを軸において取り組んでいるとのことでした。
・働き方について
Googleは全世界に約8万人もの社員がいます。だから多国籍や多様性ゆえに自由な社風のイメージが持たれていると思います。しかし、実際はそうではないことがわかりました。
Googleの規定する勤務時間は原則9時〜16時。一応フレックスタイム制なのだそうですが、その中でどう働くかは自由にしていいそうです。しかし、仕事は山下さんのチームの場合は、一旦10時までには出勤しようと決めているそうです。ただし、急用で遅れるときはしっかり他のメンバーに連絡すること。自由だからこそその範囲内でしっかりルールを決めていらっしゃいました。
質疑応答
ここでは印象的だったことを2つほど。
Q.Googleは革新的な会社？
→実は新しいものを作り出したことはない。検索エンジンも最初はYahooが生み出したが、それを改善したりしていくことで気づいたら世界シェア1位になっていた。
山下さんは事象だけでとらえるのではなく、どういう背景でなぜ起こっているのだろうということを自然に考えることが出来るのがGoogle。利益などの結果はあとからついてくると仰っていました。
私は０→１にする人も１→１０にする人も最初から画期的な何かを作ろうとしているのではなく、このような考えを当たり前のように持っていてアウトプットを続けていたら気づいたら自分の武器になっていたというパターンの人が多いんだろうなと感じました。Yahooは0から1を生み出した会社、Googleは1を10にするのが得意な会社、どちらもこの世界では必要だし求められる能力だなと私は考えました。
Q.TGIFについて
→この質問は私がした質問なのですが、TGIFというのはGoogleが毎週行っている経営トップの人と話せる会議のことです。日本では金曜の朝、アメリカでは木曜の夜に行います。ここではどんな質問でもトップの方たちは気軽に答えてくれます。主にニュースの話題が多いそうですが、ネガティブな話題について話すことも多く、人種差別や女性差別などの様々な諸問題の背景があるなかで当事者でさえ気づかない思い込みに気づくためにGoogleはどうあるべきなのかをTGIFを通じて話し合ったりしているとの事でした。
まとめ
Googleっぽい考え方(自由の尺度)
→Googleで働いている人の特徴はGoogleっぽいかどうか。それはその人の考え方や仕事の仕方にあると思います。「自由だけど自由じゃない」。人に迷惑をかけないようにするには、気持ちよく働くためには、その人が「自由」という言葉をどう捉えてどう相手の気持ちを配慮し、どう行動するのか。それらが似たような人たち、理解出来る人たちが集まっているのがGoogleなんだなと感じました。
信頼性
→Googleの役員の方はとにかく社員のことを信じています。もし、子供が熱を出してしまって出勤できなくてもそれは有給扱いにはなりません。子供が寝ている間やちょっとした時間を利用すれば会議にも参加できますし、場所を選ばずとも仕事はできると考えられているからです。また、社内での情報の流れ方も独特です。一般的には経営層から社員へ(上→下)と順に情報が伝わっていきますが、Googleの場合はそのような感覚ではなくみんなで共有されていく感覚なのだそうです。ですので世の中に出る前のBIGな情報も共有されたりもしますが、社外には決して漏れないそうです。経営層と社員との絶対的な信頼関係が成り立っているからこそ、社員の会社に対する貢献度も高まっていくのかなと感じました。
結果をだす・責任をもつ
→自由な社風がゆえにもちろん結果責任や説明責任は伴います。言い方はちょっとあれですがやるべきことさえしっかり果たしていれば、後は個人の自由裁量に任せられるのです。「自分で考えなくてはいけないからこそ、向いていなかったとしても決めたからには一度時間をかけて取り組む責任がある」という山下さんの言葉がとても印象に強く残りました。いつまでも学生気分でいるのではなく、今のうちから自分の行動に責任を持とうと決めました。
やっぱり東京は憧れるオフィスが沢山あるからか働くということを身近に感じましたし、モチベーションがすごく高まりました。働くことは人生のなかでの大部分を占めるので、キャリアについてもしっかり考えていきたいです。
なんかめっちゃ長くなってしまった。
それでは第2弾へと続きます〜。
インターン③ HTML総仕上げ
こんにちは。
先日第3回目のインターンがありました。
今回も前回同様にブラインドタッチからスタートしました。…なんとスコア30点も上がりました💪
シンプルに嬉しかったです。笑
そしてまずは画像ファイルの種類と黄金比、白銀比のお話を聞きました。
よく見かけるものばかりですが、何に使われているかとかはあまり意識したことはなかったです。
ちなみに黄金比は全世界共通、白銀比は主に日本で使われているのだそうです。このスライドからだと美しい=バランスがとれているということになりますが、なんだか納得できました。
次に本題のHTML。今回は前回挿入した画像やフォントを動かしてみたり動画の入れ方を教えていただきました。
学んだこと
・マウスを乗せることで画像を変える
・画像や文字を動かす
・リストをつくる
・表をつくる
・YouTubeの動画を貼り付ける
ここまでやると自分でつくったページがぐっとWebサイトっぽく感じました。(自画自賛)
HTMLをやってみて分かったこと
①手間と時間がかかる
文書ごとや画像ごとにタグを入れ込まなければならないため手間がかかる。あと、半角スペースとか区切りとかめちゃめちゃ大事なので反映したときにWebページではどこが間違えたのかはすぐにわかるが、ブラウザ(？)に書き込んでいる方では見つけるのに時間がかかる。
HTMLに慣れたらすんなりこういうことを思わずに作れるようになるのかな…。
②意外と自分はこういう作業が好き
パソコンはやる前から苦手と決めつけてあまり触れてきませんでしたが、いざやってみると意外とスムーズに出来たかなと思います。ただ、まだ序盤中の序盤なのでこの先どうなるかはわかりません。笑
まだ感覚だけで操作している部分があるので仕組みまでしっかり理解できると「じゃあこれはこういうことなのかな」とか「これとこれを組み合わせたらどうかな」とかを考えられるようになるのでもっと楽しくなるのかなと感じました。
とりあえず今回でHTMLは終わって、来週からはCSSに入るそうです。なんだか強敵の予感がしますが、取り残されないように頑張ります。
今回はこの辺で失礼します〜。
インターン② HTML練習
お久しぶりです！
今回は先日行われた２回目のインターンのことについて書いていこうと思います！
(ゼミのblogも近々更新します…)
今回はe-typingというソフトを使用してブラインドタッチから始まりました。こちらはまぁ、予想通り点数悪かったのでこれからコツコツ練習して上手くなれるように頑張ります。😅
そして、本題のHTML練習にはいっていきました。そもそもHTMLとはプログラミング言語のことだそうです。私はこの時点でプログラミング言語…？？なにそれ？ってなってましたが、これはコンピューターにさせたい処理を理解させるための言語のことだそうです。
プログラミング言語はHTMLの他にもこんなに種類があるそうです。(1以外全部しらなかった)
前回はHTMLに文字をいれていくだけだったので、今回はその文字の色や形を変える方法を教えて頂きました。
学んだこと
･フォントを太字、強調、斜体にする
･フォントのサイズ、色を変える
･文章に段落をつける
･改行する
･画像を挿入する
･画像のサイズを変える
･URLを挿入する
･背景の色を変える
個人的には画像の部分が結構難しかったです。結局教えてもらったので、何がどう難しかったのか、何が間違っていたのかがまだよく分かっていないのでもう一度自分で練習してみようと思います。
また、カッコ< >の数を間違えたり、スペルをミスするとページには全然反映されないし、どこを間違えているのか確認し直す作業にも時間がかかってしまうので、HTMLはそれだけ操作の正確性が必要だなと感じました。
まだまだ企業から依頼を受けて仕事として成り立たせて行くためにはトレーニングも知識も全っ然足りませんが、教えて頂いたことを早く自分の武器にして活用していきたいです。
今回はこのへんで失礼します〜〜
