TREASUREへ行ってきた話

VOYAGE GROUP

8月13日から8月31日までの三週間,VOYAGE GROUPのインターンへ参加してきました.

概要

前半は講義,後半はチームか開発となっていました.

講義内容は以下の通りです.

  • Go言語の講義
  • フロントエンドの講義
  • Web APIの講義
  • セキュリティ
    • XSS
    • SQL インジェクション
  • データベース
    • ER図
  • サーバ環境構築

その後,チーム開発

前半の講義

Go言語を用いて,サーバ側で行われている処理を勉強しました.テストを書く人と実際のコードを書く人に分かれてペアプログラミングをしました.私は,今まで一人でコードを書くことが多く,考える時間が多くかかるということが多々ありました.しかし,ペアプログラミングをしてみると,話すことによって考えが整理され,自然と手が動くという感覚になりました.今後も機会があればペアプログラミングをしてみたいです.

セキュリティの講義では,適切な処理が行われていない場合,SQLインジェクションXSSといった脆弱性を生み出してしまうので,注意が必要であることを体験しながら学習をしました.実際に脆弱なウェブアプリケーションをローカルで動かしながら,攻撃し,その脆弱性を防いでいくという講義で,なかなかおもしろかったです.

データベースの講義はとても良かったです.ER図を作成する際の手順として,

  1. エンティティ抽出
  2. 属性洗い出し
  3. どんなデータを保持するか洗い出し
  4. 正規化
  5. リレーションシップを張る
  6. 主キーと外部キー制約を定義する

という手順を紹介されていました.この手順に従って考えていくことによって,スムーズにデータベースの設計ができることを実感しました.

前半の講義を通して,新しく学ぶことばかりでとても成長できたと感じました.

後半のチーム開発

このTREASUREのテーマは,「Go言語を使って学ぶ、価値のあるもの創りとチーム開発」です.前半で学習したことを用いて,価値のあるもの創りをしました.

価値のあるものとは?

価値のあるものを考えるときに参考となるのが USN という考え方です.

  • U は User で,そのプロダクトをどのような人が使うのか
  • N は Needs で,そのプロダクトを利用することによって,どのような需要を満たすことができるのか
  • S は Solution で,どのような手法で,UserのNeedsを満たすのか

というものです. この3つが揃っていなければ,サービスとして成り立たず,価値のあるものということはできません.

私達のチームは,「インターンの参加者/社員旅行のメンバー」が「楽しみたい,わいわいしたい」という課題の解決方法として,「お題に沿って写真を投稿するライブフォトアプリ」というものを考えました.

実際の開発

プラットフォームはiOSを選定しました.Webアプリケーションとして実装するという選択肢もあったのですが,対象としているユーザ層は,共有をする際ネイティブアプリを使うという意見や,投稿の際わざわざブラウザを立ち上げてサイトにアクセスするという手間のかかることをしないという意見があり,ネイティブアプリでの実装となりました.

チームは5人で,クライアント側2人,サーバ側2人,マネジメント1人といった構成でした.

私はクライアント側の担当で Swift をゴリゴリ書いていました.しかし,最近やっていない,PCが貧弱かつ 今までとは違う書き方(Storyboardを使わない)となると開発速度がかなり落ちました.そのため,予想していたよりも長い時間がかかりました.サーバ側の方々は優秀で,クライアント側の実装待ちのような状況になっていました.非常に申し訳なかった.

マネジメントの人は,主にモック作成とクライアント側とサーバ側の連携を行うための調整を行っていました.この人がいたおかげで,私のチームは順調に開発することができたと思います. (私達のチーム以外,会社に泊まっていたような気が…)

TREASURE の感想

圧倒的に成長することができたインターンだと感じます.前半の講義はもちろん,後半のチーム開発では,どのようなことを考えて一緒にものを作っていくのか,どのようにするとより良いものができるのかということを学びました.

コンフォートゾーンの外側へ行くことができたと思います.

デザイン?よく分からんよな.僕もよく分からん.

はじめに

"デザイン"という言葉の意味を確認します.

デザイン【design】
① 下絵。素描。図案。
② 意匠計画。製品の材質・機能および美的造形性などの諸要素と、技術・生産・消費面からの各種の要求を検討・調整する総合的造形計画。
広辞苑 第六版』(岩波書店)より.

ここで注意しなければいけないのは,"デザイン" という単語は,装飾 を意味しているのではなく 設計 を意味してる という点です.良いデザインは,良い装飾という意味ではなく,良い設計という意味です.もちろん,装飾も設計の一部に含まれると思います.

なぜデザインを考えるのか

私達は普段の生活において,「伝える」という行動を頻繁に行っています.例えば,「ハンバーガーが美味しかった.」という情報を Twitter に投稿する.研究成果のプレゼンテーションを行う.プルリクエストに対してレビューを送る. これらはすべて,「伝える」という行動です.

物事を伝えるとき, 伝える人と受け取る人がいて成立します. 伝えるときに,全く違った情報が混ざっていたり,適切な表現がされていなければどうでしょうか? 全く伝わってきません.

すなわち "デザイン" を考えることは,「伝え方」を考えるということ です.

どのようなデザインが良いのか

良いデザインの多くに共通する基本原則として,

があります.

反復

特徴を繰り返すことによって,全体の統一感を作り上げることができるという法則です.

並列性のある要素に対して,繰り返しが行われているとスムーズに情報を得ることが可能です.

反復の原則に従わない場合

f:id:Polyomino:20180726220540j:plain

唐突に別の情報が入ってきて受け取り側が混乱してしまいます.また,フォントが全て違っているので,並列の情報として受け取っていいのかも悩みます.


反復の原則に従う場合

f:id:Polyomino:20180726220537j:plain

並列性のある情報が正しく配置されているので,スムーズに情報を受取ることができます.

整列

揃えることができる要素は,揃えて配置することによって違和感がなくなるという法則です.

少し調節するだけで,スッキリとした印象になります.

整列の原則に従わない場合

f:id:Polyomino:20180726221922j:plain

サイズがバラバラで,違和感を感じます.


整列の原則に従う場合

f:id:Polyomino:20180726220931j:plain

わかりづらいので補助線を引きます.

f:id:Polyomino:20180726220934j:plain

全体的にすっきりと収まっているので,情報の階層構造がわかりやすいです.

近接

関連の強いものを近くに配置し,関連の弱いものは遠くに配置するという原則です.

近くに配置することによって一つのまとまった情報に見えます.逆に違った情報である場合,余白を設けることによって別の情報であると直感的にわかりやすくなります.

近接の原則に従わない場合

f:id:Polyomino:20180726221045j:plain

インコの情報がバラバラに配置されているので,対応関係を確認するのに手間がかかります.


近接の原則に従う場合

f:id:Polyomino:20180726221048j:plain

情報がまとまって表示されているので,情報をまとまりとして受け取ることができます.

コントラスト

情報に強弱を付けるということです .文字のサイズや太さ,色を変えることで情報に強弱を付けることができます.

コントラストの原則に従わない場合

f:id:Polyomino:20180726221201j:plain

すべての文字が同じ大きさなので,どの情報が重要か分かりづらいです.また 文字と写真の大きさが中途半端なので,何を伝えているのかよくわかりません.


コントラストの原則に従う場合

f:id:Polyomino:20180726221216j:plain

鉄橋の写真ということがわかり,鉄橋が残っているとひと目で分かります.

まとめ

良いデザインは,

という点で調整されている場合が多いです.なので良いデザインを作ろうと考えたとき,この原則を思い出して検討することで 伝わりやすくて良いものになります.

おわりに

私は "デザイン" を「伝え方」であると表現しました.しかし,デザインは人によってそれぞれであり,"デザイン" を「マナー」としている方もいますし,"デザイン" を「ユーザーとの関係性をかたちにすること」と表現されている方もいます.
このように,"デザイン"というものの捉え方は人によってそれぞれです.一つの考え方にとらわれず,自分にあった考え方を持つことこそがデザインの本質ではないでしょうか.

『伝わるデザインの基本』を下さった yonex 氏に感謝しています.

参考文献

ノンデザイナーズ・デザインブック [第4版]

ノンデザイナーズ・デザインブック [第4版]

リンクスタートしたかった.

某アニメで出てくるかっこいいアレをモチーフにした画像をillustratorで作ってみた.

完成作品

f:id:Polyomino:20180513180546j:plain

まず,まわりに飛んでいる謎の長方形をつくる.

ひとつひとつ作ってもいいけど,手間がかかるのでまとめつくる.

長方形ツールで適当な大きさの長方形をつくる.

f:id:Polyomino:20180513180639p:plain

f:id:Polyomino:20180513180646p:plain

そのあと,段組み設定からこの長方形を分割する.

f:id:Polyomino:20180513180915p:plain

分割する量はお好みで.

f:id:Polyomino:20180513180920p:plain

色を塗っていく f:id:Polyomino:20180513181112p:plain f:id:Polyomino:20180513181108p:plain

いろんな色の長方形を作りたいから,ランダムに色をつくる.

右上だけ色を変える

f:id:Polyomino:20180513181254p:plain

上下にブレンドでいろんな色をつくる

f:id:Polyomino:20180513181330p:plain f:id:Polyomino:20180513181334p:plain

自分でランダムに配置してもいいけど,悩むから僕は場所を入れ替えた.

f:id:Polyomino:20180513181455p:plain f:id:Polyomino:20180513181501p:plain

かっこいいアレを作っていく

f:id:Polyomino:20180513181608p:plain

遠近図形選択ツールで,さっき作った長方形を配置していく. f:id:Polyomino:20180513181628p:plain

それっぽくなってきた. f:id:Polyomino:20180513181714p:plain

背景を整える.

f:id:Polyomino:20180513181800p:plain f:id:Polyomino:20180513181804p:plain f:id:Polyomino:20180513181809p:plain

完成 f:id:Polyomino:20180513180546j:plain

インターンシップへ行って学んだこと(2回目)

2月5日から2月16日まで,Yahoo! JAPANインターンしてきました.

Yahoo! JAPAN は,グランフロントに大阪オフィスがあり,私はここへ毎日通っていました.(土日,祝日は休みです.)

インターンの概要

インターン参加人数は7人で,それぞれが別々のチームに配属される形で実施されていました.
僕は,Yahoo!天気・災害の災害チームに配属されました.そこで,iOSアプリケーション改修のお手伝いをしました.

emg.yahoo.co.jp

実際に使われているアプリのソースコードをさわるという貴重な体験ができたことは,とても良かったです.

インターンの詳細

インターンのある一日

  • 10:00 出社
  • 10:15 チーム内ミーティング
  • 10:30 開発
  • 12:00 お昼休み
  • 13:00 再び開発
  • 15:00 社内勉強会
  • 16:00 プロジェクト内ミーティング
  • 17:00 開発
  • 18:00 1 on 1
  • 18:30 終業作業
  • 18:45 退社

チーム内ミーティング

基本的にチームの全員が参加されていました.ここで,各プロジェクトの進捗共有などされていました.チームのプロジェクトが今どのような状況にあるのかを把握することができ,また 連携が必要な部分の調整などについてもここで話し合われていました.

 【補足】
「チーム」は ”防災” や "天気" のような分類で,「プロジェクト」は "アプリ",”バックエンド” などの分類です. 今回私は,防災チームのアプリプロジェクトメンバーでした.

社内勉強会

社内向けに勉強会が開かれていました.開発に携わる多くの人が来るものや,iOSの開発者が集まる勉強会など様々でした.

プロジェクト内ミーティング

アプリ開発に携わる人でミーティングでした.アプリのUI等についてAndroidiOSの人で話し合ったり,デザイナーさんと意見を交換したりしました.

1 on 1

インターンでこの言葉を初めて聞きました. 検索すると出てきますが,「上司と部下が対話する」感じです. 普通に開発やミーティングをしていると,なかなか思っていることを言い出すことができないかもしれませんが,ここでいろいろと相談することもできます.

本が出ているようです. http://amzn.asia/8YMHblv


ミーティングや勉強会は 日によって様々で,あまり開発する時間を取れない日もありました.その一方で,丸一日開発という日もありました.

インターンで学んだこと

他人のコードを読む

最近は,多くのOSSがあります.それらのコードを読んでみると,自分たちが知らないところ(知らなかったところ)でどのような処理をしているのかを理解することができます.その裏側を知っていることによって,自分の書くコードをいい感じにすることができます.また,多くのすごい人たちが作りあげているので,単純に勉強にもなります.

勉強し続ける

前提として,コードを書くことだけが勉強ではありません.本を読んだり,映画を見たり(SFとか?),発表したり,他人のコードを読むことも勉強です.プログラムなどの技術には,移り変わりがあります.なので,「【任意の言語】を勉強しておけば大丈夫」や,「【任意のシステム】だけで生きていく」などはリスクがあります.その時代に合わせて,自分を変化させていく必要があります.勉強を続けることで,変化にも対応することができます.

勉強するモチベーション維持の方法

  • いろいろなことに興味を持つ
    • 興味のある分野を増やすことによって,「疲れてきたから別の興味があるものを勉強しよう」という技が使えるようになります.
  • 勉強会に参加する
    • 勉強会へ参加することによって,情報交換ができます.また,同じ分野の仲間とも出会うことができます.
  • 根性

いろんな人の意見を聞く

これは,デザイナーさんから聞いた話です.自分が良さそうと思ってデザインしたものでも,他の人がもっといいデザインのものを思いつく可能性があります.

いろんなことをする

新しい分野を勉強するとき,0から始めることはとても苦労します.少しでも,勉強した経験があれば,新しく勉強を始めることが簡単になります.

学生の間は,自由に勉強することができます.「業務で使うから,絶対に~をしなければならない」という強制などはありません.自分の好きなときに,自分の好きなことができます.できる間にいろんな好きなことをしておきましょう.


今回のインターンでは,実際のエンジニアに近い経験ができました.このようなインターンを用意してくださった Yahoo! JAPAN の皆様ありがとうございます.

インターンへ参加することによって,実際の社会ではどのような手法で開発されているのか.何を考えてサービスが作られているのかを知ることができました.

ぜひ皆さんもインターンへ参加してみてください.

傲慢な大学生がインターンシップへ行くことになった話(2回目)

某社に2週間インターンへ行くことになりました.

今回の企業は,大企業です. たぶん,誰もが1度名前を聞いたことがある企業です.

インターンへ参加し,技術やエンジニアとしてどうあるべきかを学んできたいです. また,ベンチャー企業との違いを知り今後のエンジニアライフに役立てたいです.


これだけでは少し物足りないので,選考のときのことを書きます.

私の申し込んだインターンの申し込み期限は,12月中旬でした.春休みに実施されるインターンの選考は,主にこの時期にあると考えても良さそうです.12月末のところもいくつかありました.

申し込み用紙には,以下の質問がありました.

  • 言語やOSの経験,期間
  • 研究内容の詳細,自信のある開発経験
  • 手がけたプログラムで自信のあるもの

自信のある開発経験と自信のあるプログラムって似てる気がする...

私の回答はこんな感じです.

言語やOSの経験

JavaScript 3年
プロジェクションマッピングにおいて,Node.jsでWebSocketサーバ構築.
Node.jsを用いてArduinoの制御
ブラウザ拡張機能の制作

Swift 3年
プロジェクションマッピングにおいてSpriteKitを用いたインタラクティブ映像の作成.
生放送サービスにアスキーアートを投稿するiPhoneアプリケーションの作成

Python 2年
(アルバイト関係)

C言語 2年
基本的な動作の理解,

Java 1年
基本構文やJavaアプレットで簡単なアプリケーションの作成.
初歩的な内容を高校で教える.

期間だけ見れば詐欺ですね.

私の場合,日替わりで言語を勉強したり,行き詰ったらしばらく別の開発をするというスタイルなので 期間は長くなっています.(別の開発している期間全く考えてないわけではないので,大目に見て 🙏)

CentOS 7
個人制作物紹介ウェブサイトの作成.

それぞれに対して具体的に何をやったのかを書くと選ぶ側もわかりやすいと思います. また,そのソースコードGitHub などに上げておくとより効果的だと思います.

研究内容の詳細,自信のある開発経験

この質問は 主に大学院生など研究室に配属されている人に向けられている質問ですね.私は,2年生なのでまだ配属されていません.なので,自信のある開発経験を書きました.

私は,Webの技術に興味を持っています.なので,自分のウェブサイト( https://polyomino.jp

)を作ったときの話を書きました.まずこの技術に興味を持ったきっかけを書いた後,自分がどのようにして学んできたかを書きました.最後に 今していることを書くと字数制限ちょうどぐらいでした.

順を追って書いていくと,かなり書きやすかったです.(おそらく,読む人も読みやすい)

余談ですが,ずっと前に読んで良いと思った本です.

自信のある開発経験

上の質問とほぼ同じでしたが,同じことを書いてしまうと読む人もつまらないだろうと考え,別の開発経験について書きました.

プロジェクションマッピング」を実施したときの話を書きました.(WebVRを利用したアプリケーション開発なので,広い目で見ると "Web" ですけどね.)

利用した技術と苦労したところ,もし今後するとしたとき改善できるところなどを書きました.



あと,GitHubや個人制作物のリンク,ブログがあれば載せる場所があったので,そのフォームを埋めて提出しました.

締め切りから数日後,書類選考通過の連絡がきました.テストの受験依頼と履歴書の提出,web面接の日程調整でした.

私はこの連絡が来た日に面接日の予約とテスト受験をしました.忘れるといけないので.

「テスト」とあったので,AtCoderのようなものを想定していましたが,実際は違いました.

いわゆる SPI (?) と呼ばれるもので,迫りくる時間がかなりのプレッシャーになりました.もし,インターンへ参加するときテストがあれば,このような形式のテストも存在するということを覚えておくといいかもしれません.

https://www.benesse-i-career.co.jp/univ/assessment/pdf/gps_academic.pdf

さて 面接ですが,特に問題なく終えることができました.エントリーシートを書く時点で,自分のしてきたことや興味があること,やりたいことなどをまとめているので,詳細を付け加えながら話すだけでした.この直前に準備などはマイクのテストぐらいでほとんどしていません.強いて言うなら,一つだけ質問を用意しておきました.これは,もしお祈りされたとしても,「現場の人から聞くことができた」と自分を落ち着かせるためです.いわば自己満足ですね.

こうして 数日後参加許可のメールが届き,2月5日からインターンへ参加することになりました.

精進します.

インターンシップへ行って学んだこと

PCを掃除していたら,インターン期間中のメモが出てきたのでここへ記録します.

私は,2017年の 8月17日 から 9月6日 まで モイ株式会社へインターンしてきました.

モイ株式会社は,ツイキャスを中心としたサービスを展開している会社です. 最近,LIVE配信サービスが乱立していますが,ツイキャスは2010年からサービスを提供してるいわば古参です. これだけ長く続いているものはとても珍しいと思います.UstreamIBMに買収されちゃいましたからね.

会社情報 | モイ株式会社

インターンの概要

僕が参加したときのものなので,あくまで参考程度に読んで下さい.

まず,自己紹介をします.みなさん好きな言語などを紹介していてエンジニアだなぁと思いました.(僕はJavaScriptが好きと答えました.)
その後,ハッカソンがありました.「1日でツイキャスAPIを利用した何かを作る」が課題で,僕はiOSアプリケーションを作成しました.

ここでの発表と制作物から判断され,チームが組まれました.

このまま3週間程度チーム開発です.(途中にツイキャスのサポートや歴史についてのお話もありました.)

最終日に成果発表して終了です.

インターンで学んだこと

他人が読んで分かるコードにしよう

自分しか見ないコードを書く時,ついつい面倒になって短い変数名や雑な処理方法を書いてしまいがちです.そのようなコードは,3ヶ月後自分が読んでも理解できなくなっています.コードを書く時は,常に読みやすいコード(他人が読んで分かるコード)を書きましょう.

この話を聞いたとき,「 O'Reilly Japan - リーダブルコード で読んだことと同じだ!」と思いました.
他人が読んでわからないコードは,いずれ自分も読めなくなってしまうということを実感しました.

言語,ライブラリの選定

例えば,自分が一つの言語/ライブラリ しか知らなかったとします.するとどうしても,それを用いたいという気持ちが生まれます.
他の言語を使う方が,より簡単, より早く, より分かりやすく なるかもしれません.
複数言語を知っていると,なぜその言語を使うのかと考えることができます.

ひとりのエンジニアとして

エンジニアとして正しくあるべきです.例えば,公平な選定をしましょう.
チーム開発時に 個人的な理由で,言語 / ライブラリ を選定し仲間に強要するのはダメです.

chadfowler.com

絵文字を用いることで表現がまろやかに

この話を聞いた時衝撃的でした.絵文字は,"ワカモノ" が使う謎のツールという認識が当時の僕にはあったからです.

チーム開発をしていく上で,コードのレビューなどのコミュニケーションは欠かせません.そこで,文章だけで連絡を取り合うとどうでしょうか? キツい言い方をされたと相手が受け取り,お互いが嫌な気持ちになってしまうかもしれません.絵文字があることによって,表現の幅が増えてまろやかに伝えることができます.👍

テストは大事

テストを書くことによって,意図した動作がされているのかの確認ができます.CIツールというものもあることを知りました.
テストを書くことはきれいなコードを書くことにもつながります.テストがしにくいコードは,煩雑なものであったりする場合が多いです.

余談として TDD というものも教えていただきました.
テスト駆動開発 - Wikipedia

タスク管理しよう

タスク管理することによって進捗を判断することができます.
期限が決まっているものの場合,進捗状況をみながら完成物の調整などをすることができます.

GitHub の使い方を知る

私は 高校のころからプログラミングをしていますが,このインターンに参加するまで ソースの管理はいつもフォルダ分けしていました.

普段のプログラミングは1人で行っていて,誰かに見せるコードも無かったためこのようにしていました.

GitHubというサービスの存在は知っていて,ソース管理ができるということまで理解していました.しかし,コマンドがなかなか覚えられない / 自分のコードを他人に見せる必要が無いと思い利用していませんでした.インターンに参加するまで,git add ., git commitgit push ぐらいのコマンドしか知りませんでした.

インターンでは,チームで開発を行っていました.そのため,コードの共有やレビューが発生します.GitHubの使い方 / Gitの使い方はインターン終了時には実務で使うには問題が無いレベルにまで成長することができました.

クレーマー = 怒っている人ではない

クレーマーというと一般的に怒っている人という印象を持ってしまいがちですが,全員怒っている人というわけではありません.
利用していて何か問題があるから伝えに来ています. その問題をまず把握することによって,解決の糸口を探していくことが大切だと理解しました.

ユーザーをよく見よう

ユーザーを見ることによって,そのサービスのどのあたりに価値があるのか 改めて知ることができます.
その価値を捨てること無く,サービスを提供し続けることができればとても良いことです.

低レイヤーを知る

低レイヤーを知っていることで,アプリケーションの作成をするときに役立ちます.

実際に動かそう

サーバーなど,どのような設定をすると自分の思った通りに動作するのかということを知るには,動かしてみるのが一番です. 仮想マシンなどを用いて実際に動かして設定してみると良いです.
実際に動かすことによってより理解が深まります.

このことは,どの分野においても言えることだと思います.私はネットワークを勉強する際,実際にサーバを借りてウェブサイトを作って理解しました.理論で何度も勉強するより,一度やってみると案外すぐに理解することができるかもしれません.


インターンへ参加することによって,実際の社会ではどのような手法で開発されているのか.何を考えてサービスが作られているのかを知ることができました.このインターンは僕の人生にとって,大きな影響を与えると思います.

ぜひ皆さんもインターンへ参加してみてください.

最後に,今ツイキャスでは誕生日キャンペーンやってるみたいです.ビーズクッション欲しい...

twitcasting.tv

あけましておめでとうございます.

あけましておめでとうございます.

今年もよろしくお願いします.

2017年,私は主にWeb関連の開発をしてきました.React や Vue を試してみたり,VPSを借りてセキュアな早いサーバーの構築方法を考えたりしました.

そこで,私は悟りました.

ブラウザのことを理解せずにWebの開発をできるのか? と,

ということで,2018年はブラウザの気持ちを理解する年にします.