株式会社クイックのWebサービス開発blog

HAPPYなエンジニア&デザイナーのブログです

プリンターのイントールを改善しちゃおうの巻

こんにちは!ヘルプデスク担当のIMAXです!!!!

チョコミントに癒やされながら、日々障害と楽しく過ごしています 三( ε: )

早速ですが世のヘルプデスクの皆さん!
社内のプリンター設定・ドライバーのインストールってどうされていますか?


設定、インストール作業を実施する上でよく遭遇する場面として

  • 設定する対象者が多い
     →ユーザーが出来たら大人数でも手間がなくなるよなぁ…
  • 日程調節をしているとだいたい土日しか無理
     → ユーザーでもインストール出来たらいいけど…管理者権限もたせてないしなぁ…
  • 標準を白黒印刷にしたいなど、ドライバーを入れた後に個別での設定が必須
     → インストールだけでも大変なのに個々に設定を入れていく手間を無くしたいなぁ…

何よりひとつひとつの設定を大多数にしていく作業が面倒くさいですよね(´・ω・`)

そんなヘルプデスク担当のあなたにピッタリなツールをご紹介します!
※但し富士ゼロックス製品に限る


これから紹介するツールを使えば、ポチッとEXEを叩くだけで!!!!
なんと!!!プリンターがインストール出来るのです!ヮ(゚д゚)ォ!
白黒等の詳細設定だって一緒に反映できちゃうのです!
もちろん管理者権限なくてもインストール出来ますよ!
ではでは、早速ご紹介していきましょう。



目次

まずは準備

  • 使用するツールは「Print Driver Customization Tool」
    富士ゼロックスの公式サイトからダウンロードすることができます。
    以下のページ内の「使用許諾条件に同意しダウンロード」をクリックし、自己解凍形式のEXEファイルをダウンロードします。
    ダウンロードしたEXEファイルを実行するとEXEファイル名のフォルダが展開されます。

www.fujixerox.co.jp

  • 使いたいプリンタードライバーもダウンロードして、予め展開しておきましょう!
    ※例としてC3371の32bit版を使います。


実際に使ってみよう!

まずは「Print Driver Customization Tool」から「pdct.exe」をたたきます。
32bitの参照から、ドライバーから展開したフォルダを開きinfファイルを指定します。
画像の様に機種名が自動で一覧内に表示されるので、対象機種を選択し「初期値の設定」を選択します。 f:id:aimstogeek:20180709142448p:plain

初期値の設定とは?

白黒印刷しかさせたくない場合、プリンターを入れた後に個別で白黒を標準として設定していた( ˘ω˘)ネムゥイ
…これが今までの手法だと思いますが「初期値の設定」で設定してしまえば
「白黒しか印刷できないプリンター」として設定ができます(`・ω・´)シャキーン!

それを踏まえて設定してみよう!

初期値の設定を選択すると下記画像のように細かい設定ができます。
今回は白黒の印刷設定しか行いませんが、両面の印刷方法など適宜の設定に合わせてみて下さい。
希望設定が完了しましたら下部にある「OK」を選択します。 f:id:aimstogeek:20180709143028p:plain

そうすると「初期値の設定」部分に「設定あり」と出てきます。
何も出てこない人は「キャンセル」を押しているか、何も変更されていないので気をつけて下さいね! f:id:aimstogeek:20180626110513p:plain
次に、その下にある「バージョン情報に表示するコメント」については、設定者や管理者が見て分かる様にできていればいいと思います。(設定に影響がある部分ではないです) わたくしIMAXは「C3371_2color」としました。
更に下にある「カスタマイズ実行後のプリンタードライバーの保存先」については、わかりやすい場所に保存をして下さい。 今回のためにフォルダを作ってもいいですね。

さて、これでドライバーの初期値の設定は完了です!

どんどん進もう!

次に使うのは「Print Driver Customization Tool」が展開されている同一フォルダ内にある「Easy Setup for Customized Print Driver」を使います。
ここまで来たらもう完成したも同然ですよヽ(・ω・)/!

今度のツールは何ができるの?

「Easy Setup for Customized Print Driver」はプリンター名やIPなどの固有指定に加え、
管理者権限が無くてもインストールする事を可能にしてくれます!
また、ドライバーインストール画面を表示せずとも、バックグラウンドでセットアップが可能になるので、ユーザーの業務の邪魔にもなりません!ナンテ ベンリ ナノ( ゚д゚ )

設定第二弾!

「Easy Setup for Customized Print Driver」のフォルダ内にある「MkSetup.exe」を叩くと下記のような画面が出てきます。
カスタマイズしたドライバーファイルに、先程作成し保存したinfを参照すると、作成したプリンター機種が表示されるのを確認しましょう。
その次の項目にある「プリンター名」の部分で任意でプリンター名を付けます。
(今回はC3371_白黒プリンタと名付けました)
出力先ポートについては、各環境に合わせて設定を行って下さいね。 f:id:aimstogeek:20180626172819p:plain

またセットアップオプションにて、3つの細かい設定ができます。
1)共存できないプリンターを削除する
 →例えば、プリンターは同じだけど設定が違うプリンタが存在する場合、
  共存させたいのであればチェックは入れないで下さい。
  既存のプリンターへ設定変更等で上書きさせたい場合はチェックを入れましょう。


2) 画面に表示しないでセットアップを実行する
 →ユーザーに影響なくインストールすることができます。
  但し完了のポップアップもないので注意です!


3) 一般ユーザーによる実行を許可する
 →ユーザーにインストール権限を与えていない場合、管理者情報を入力しておけば
  権限が無くてもインストールを可能にする機能です。
   これでもう、管理者情報の入力をしにユーザーのもとへ行かなくていいのです!
  リモート作業もしなくていいのです!ワーイワーイヽ(゚∀゚)ノ

セットアップオプションを設定しよう!

今回は3項目の全てにチェックを入れた状態で行います。
「一般ユーザーによる実行を許可する」にチェックを入れると、画像の様に別窓が出てきます。
各項目に入力してOKを選択してください。 f:id:aimstogeek:20180627133538p:plain

すべての設定が完了したら

セットアップパッケージの保存先を参照します。
今回のパッケージで作られるexeを主に使用するので、特にわかりやすい場所に保管しましょう。新規フォルダを作成してもいいと思います。
IMAXはだいたいプリンター名のフォルダを作ってそこに保管しています(「・ω・)「ガオー

インストールできるかな!

すべてのセットアップが完了したので、実際に作成したexeを叩いてみましょう。
保存したフォルダから「UserSetup.exe」を叩きます。
※テストする際に管理者権限があると問答無用で入るので、必ず一般ユーザーでインストールテストを行ってください。

うんともすんとも言わないので不安になりますが、しばらくするとプリンターの一覧に今回作成したプリンターが出てきます! プリンターのプロパティを見てみると………白黒印刷のみになっています!

わーーい!これで完成です! ユーザーが実行する際に不安になる複雑な手順もなく、希望するプリンターを入れることができます!
これでみんな幸せになれるね(^q^)!!!!!

おわりに

主に手順内容だったので長くなってしまいましたが、いかがでしょうか?
少しでも参考になれたら幸いです!

また次回もなにか小技を紹介できたらいいな~



\\『明日のはたらくを創る』仲間を募集中です!! // 919.jp

CSSのプリプロセッサーとポストプロセッサーはどれがイイ?

毎日暑いですね。
そろそろ夏らしい髪型にしようかな〜とお考えの方や、
一年の季節は「夏夏夏秋」だと感じているそんなアナタに!!

とっても涼しげな髪型の作り方を〜と、 前置きに長々書いたら「全部カットで。」と言われた二代目ツーブロック担当のboriです。



目次

プリプロセッサーとポストプロセッサーとは?

近年のCSSにはプリプロセッサーとポストプロセッサーなる便利なツールがあります。(ここではツールで一纏めとする)

プリプロセッサ

独自の言語(メタ言語)で書かれたスタイル構文をCSS構文へと変換してくれる。
例:Sass、Less、Stylus

・ポストプロセッサー

CSS構文を便利なプラグインなどを通してより良いCSSへと変換してくれる。(自動整形やプレフィックス付与など)
例:PostCSS

ここではいずれも変換の事をコンパイルと呼びます。

もう少し分かりやすく説明しましょう。

焼肉屋をイメージしてください。

カルビ  = Sass
ハラミ  = Less
牛タン  = Stylus
七輪   = プリプロセッサ
焼いた肉 = CSS
焼く作業 = コンパイル

生肉の状態ではいくつも種類があります。
それらを七輪で焼きます。
「焼いた肉」にしてしまうのがプリプロセッサーです。
(焼けたカルビだろ!って細かい事は言わずに)

f:id:aimstogeek:20180706112535p:plain

焼けたお肉はタレにつけて食べますよね。

タレのお皿 = ポストプロセッサー
甘口ダレ  = 自動整形プラグイン
辛口ダレ  = 自動プレフィックスプラグイン
レモン汁  = 関数を使えるようにするプラグイン

お肉の味付けを自由に変えられるのがポストプロセッサーです。

f:id:aimstogeek:20180706112558p:plain

では、プリプロセッサーの時点では味はないのか?
いえいえ。元から味付けが施されたお肉ってありますよね?

Sassなどにも関数を始め、様々な機能がデフォルトで使えます。
しかし、必ずしも全機能が必要とは限りません。

ポストプロセッサーでは必要な機能だけを加えていけるのが特徴です。
プロジェクトの途中で甘口を辞めて辛口に〜なんて事ができます。

どちらにもイイところがあるので、実際に操作してみましょう。
今回はSass,Stylus,PostCSSの3つをご紹介します。
(インストールやコンパイルについては省きます)


Sass

最もメジャーですね。
日本語のドキュメントも多く、GUIの無料コンパイルツールもあるので始めやすいです! Rubyで作られておりますので、ホスト環境にRubyをインストールする必要があります。(Macは必要なし)
SassとSCSSという2種類の記法がありますが、今回は多く使われるSCSSの記法にて、
ネスト・変数・extend・mixin・importをご紹介します。

ネスト

SCSS

.hoge{
  .foo{
    color: #000;
  }

  .bar{
    color: #999;
  }
}

コンパイル後のCSS

.hoge .foo{
  color: #000;
}

.hoge .bar{
  color: #999;
}

親のセレクタ内に子のセレクタを書く事でネストを表現できます。
hogeの記述は一回で済み、親子関係も探しやすいですね!

変数

SCSS

$black: #000;
.hoge{
  .foo{
    color: $black;
  }
}

値を変数に代入する事が可能です。
多用する値であれば便利ですね!

extend

SCSS

%hoge{
  color: #000;
}

.foo{
  @extend %hoge;
  font-size: 16px;
}

.bar{
  @extend %hoge;
  font-size: 20px;
}

コンパイル後のCSS

.foo, .bar{
  color: #000;
}

.foo{
  font-size: 16px;
}

.bar{
  font-size: 20px;
}

スタイルを継承する事ができます。
継承したセレクタはグループ化され、セレクタが長くなりますので、注意が必要です!

mixin

SCSS

@mixin hoge($color: #000, $size: 14) {
  color: $color;
  font-size: $size + px;
}

.foo{
  @include hoge(#999, 18);
}

コンパイル後のCSS

.foo{
  color: #999;
  font-size: 18px;
}

スタイルを一式で関数化できます。
値だけが違うスタイルパターンも1つのmixinで対応できるので便利ですね!

import

SCSS

@import "base";

CSSでのimport

@import url("base.css");

機能ごとなどにスタイルファイルを分割しておけば、編集・管理が楽ですよね!
分割したファイルを一纏めにして出力してくれるのがimportになります。

サーバーにアップロードする際、CSSだと分割したファイルもアップする必要がありますが、 Sassでは1つのCSSファイルに集約してコンパイルする事ができるので、 アップするファイルは1つで済みます。

CSSのimportにはブラウザの表示速度が下がるデメリットもありますが、
Sassではコンパイル時にimportをするのと、ファイルサイズの縮小もあり、
その心配はありません!



Stylus

Node.jsで作られているので、Node.jsをインストール必要があります。
Node Loveな人でGulpやPug(Jade)などNode系で統一したい人はいいですね。(?)

そして、Sassで可能な事はStylusでもほとんど可能なんです。
ただ、Sassに比べるとドキュメントの量は少なく、無料のGUIコンパイルツールは無い(たぶん)ので、 若干導入の難易度は上がります。

ここではSassと比較してのちょっとした記法の違いや応用的な使い方についてご紹介します。

変数

Stylus

hoge = #fff;

SCSS

$hoge: #fff;

変数を宣言すると言ったらやっぱりイコールの方がしっくりきますよね。

mixin

Stylus

hoge(color = #000, size = 14) {
  color: color;
  font-size: size + px;
}

.foo{
  hoge(#999, 18);
}

SCSS

@mixin hoge($color: #000, $size: 14) {
  color: $color;
  font-size: $size + px;
}

.foo{
  @include hoge(#999, 18);
}

なんという事でしょう。
当然ですがfunctionも修飾子もいりません。
それどころかmixinもincludeも不要なんです。

応用

jsでStylusの変数を共有したいといった場合、
Stylus用のプラグインを使用する事で可能です。

今回は細かい使用方法のご説明は省きますが、
「foovar」というプラグインではStylusの変数をjs側へ出力する事が可能です。
https://github.com/all-user/foovar

github.com

Sassではjsonを介しての値の共有などは可能ですが、
直接的な共有方法は無いのかもしれません。
(ご存知の方はコメントで教えて頂けると嬉しいです)


PostCSS

こちらもNode.jsで作られたツールなんです。
単体ではほとんど意味はなく、様々なプラグインを使うことによってCSSを変換させます。

ここでは例としてAutoprefixerとPostCSS Assetsをご紹介します。

Autoprefixer

.hoge{
  display: flex;
  display: -webkit-flex;
}

CSSでは正式に実装されていないプロパティを先行的に使用する事ができます。
その際、プロパティの頭にベンダープレフィックス(接頭辞)と呼ばれるものを付け、
そのプロパティが拡張機能であると明示する必要があります。
また、ベンダープレフィックスはブラウザごとに書き方が異なります。

これらを自動で付与してくれるという文字通りのプラグインがAutoprefixerです。

PostCSS Assets

SCSS

.hoge {
    background-image: resolve('bg.png');
}
.hoge {
  background-image: url('/images/bg.png');
}

画像に関する様々機能を有しています。
上記の例では画像名だけで画像のパスを補完してくれる機能です。
その他、画像サイズを取得して値として出力したり、キャッシュ対策として画像のパスにランダムなクエリ文字の追加なども!


結局どれがいいの?

プロジェクトによったりなどはあるかと思いますが、 個人的にはStylus + PostCSSが良いのかなと思います。

理由としては記法の好みとjsとの変数の共有ですね。

ただ、jsでの共有はCSS自体で既にそれが可能(IE11以外)になっていますので、 今後はPostCSSと併用するプリプロセッサーは記法の好みだけになるかもしれません。

そもそも併用はどう...なの?という考えもありますが、 Stylusの機能、Sassの機能をフルで活用しないのであれば、PostCSSのみで良いと思います。

StylusやSassの全機能は欲しい、更に追加であれもこれも欲しいって事なら併用しちゃいましょ!
髪型もCSSの環境も自由に選び、快適なものにしたいですよね。

ちなみに社内ではまだまだ議論の真っ最中で、日々ベスト環境を模索中です!

 
 
クイックではベストなCSS環境を考えてくれる方を募集しています。



\\『明日のはたらくを創る』仲間を募集中です!! // 919.jp

プレゼン資料の作り方と伝え方のコツ

こんにちは!
最近ジェスチャーで会話するのがマイブームになっています。よっすぃです。

今回は、主にパワーポイントでプレゼン資料を作成するときに私が意識していること、他の人から話を聞いて、いいなと思って取り入れている点などをご紹介したいと思います。

①資料を読んだ後の読み手の状態をイメージする

f:id:aimstogeek:20180627102654j:plain

資料を作り始める前に、まずはその資料を読んでくれる人のことを考えることが大切です。大切な時間を使って自分の作る資料を読んでもらうわけですから、そこには何らかの目的があるはずです。

 その資料を読んだ後、読み手にどうなっていてもらいたいのか

「上司に承認をもらいたい」
「受講者にセミナーの内容を活用してもらいたい」
など、色々あると思いますが、資料を読んだ後の読み手の状態をきちんとイメージできると、この資料の目的・何を言わなければならないかが明確になってきます。

②読み手が現時点で知っていること・知らないことを把握する

会議のときに、「まずはここまでの経緯を説明させてください」と言われて、既に知っている話を延々と聞かされたことのある人もいるのではないでしょうか。

f:id:aimstogeek:20180627103157p:plain

資料を使って何かを説明するとは、その資料を通して、その人が知っていることと知らないことのギャップを埋める作業になります。

相手がどういう人で、今何をどこまで知っているのかを把握できれば、余分な資料を作成・説明する手間も省けますし、本当に伝えたいことにメッセージを絞り込んで、より読み手に刺さる資料をつくれます。

③サマリーを書いてみる

サマリーとは資料全体の内容を一枚のスライドにまとめた要約です。これを書くことの良さは2つあります。

 1. 全体のストーリー(何をどんな順で説明するか)が分かる
 2. この資料全体を通して伝えたいことが何か分かる

この「分かる」は読み手だけでなく、書き手にも言えることで、サマリーが書けないときは、この資料で何をどういう順番(ストーリー)で伝えたいかがぼんやりしているということになります。

資料を作成していて、「あれ、この資料って何を言うものだっけ?」とわからなくなったときは、サマリーに立ち返ることで今何を説明しようとしているのか確認することもできます。資料に載せないとしても、サマリーを書いておくことはとってもオススメです。

④メッセージは短く絞り込む

資料にはメッセージが必要です。もしメッセージがないと、読み手は同じ情報から様々な解釈を(時にはこちらの意図と違う解釈を)してしまいます。

 メッセージなしのスライドだと... f:id:aimstogeek:20180627110644j:plain  「A事業部の売上低下をどうにかしないと」「B事業部をもっと伸ばしていこう」など
 人によって様々な受け取り方をしてしまう。

 メッセージをつけることで... f:id:aimstogeek:20180627110654j:plain  言いたいことが明確に伝わる。

そして、メッセージは短く絞った方が、より読み手に伝わります。できれば、1つのスライドにメッセージは1つまでが分かりやすいと思います。もし、同じ図や表を用いて複数のメッセージを伝えたいときは、思い切ってスライドを2つに分けた方がよいかもしれません。

 メッセージが多いと... f:id:aimstogeek:20180627154545j:plain  よく読めば言いたいことは分かるが、メッセージが多く論点も違うため
 メッセージが伝わりにくい。

 スライドを分けてメッセージを絞ると... f:id:aimstogeek:20180627155530j:plain f:id:aimstogeek:20180627154736j:plain  メッセージが明確になり伝わりやすい。

書き手が思っている以上に、読み手はスライドから多くの情報を受け取ります。見せ方一つでメッセージの伝わり方も大きく変わるので、なるべくシンプルに伝えたい言葉を絞り込むなど工夫していけるとよいと思います。

⑤読み手の感情に配慮したワーディングをする

これは資料の中のメッセージだけでなく、プレゼンや会議での説明時にも言えることです。 読み手が気持ちよく読んでくれるように、読み手の感情に配慮した言い回し・伝え方をすることは非常に重要です。

例えば、社内で長年運用していた評価制度が機能しなくなったとき、制度変更の必要性を人事部長に提案するとします。ちょっと極端な書き方をしていますが、どちらがより気持ちよく受け入れられる伝え方か、考えてみてください。

パターンA

「今の評価制度はダメです。制度変更が必要です。」

パターンB

「今の評価制度は、これまで社員をモチベートし、会社の発展を支えてきた 素晴らしい制度だと思います。ただ、今は環境が大きく変わっています。 その環境に合わせて会社も変わっていかなくてはならない。 そのためにも、これまでの制度を変更をする必要があります。」

どんなに素晴らしい内容でも、読み手に受け入れる気持ちが起こらなければ資料は読んでもらえません。 大事なのはダメ出しをすることではなく、資料の目的を果たすというところを押さえておくとよいでしょう。

その資料を通して、お互いに気持ちよく前向きな気持ちで、次のステップを踏み出せる状態を作れるとよいなと思います。

まとめ

ここまでを図にまとめると、以下のようになります。 f:id:aimstogeek:20180627153359j:plain

いかがでしたでしょうか?

ここでご紹介したのは手法のようなものではありませんが、こういうことを意識しておくとよいかなと思ったものをご紹介しました。

もちろん状況によっては、メッセージを使わず絵だけで説明するといったこともあります。そのまま取り入れることがよいのではなく、あくまで資料の目的・読み手の状態に合わせた資料づくりをすることが大切かと思います。

みなさまのご参考になっていれば幸いです。



\\『明日のはたらくを創る』仲間を募集中です!! // 919.jp

社内LT大会での個人的な気付き

はじめまして。クイックSREチームのmiです。

先日、LT大会が開催されました。

今回はLT大会の様子と、そこでの個人的な気付きについてお伝えしたいと思います。

概要

私たちの課では、四半期に一度LT大会が開催されます。

※LT大会のLTとは「ライトニングトーク」のことで、数分程度の短いプレゼンテーションのことを指します。

アウトプットの機会を作ることを目的に開催される本大会は、毎回違ったテーマがあり、発表者はそれに合わせてプレゼンを考えていきます。

今回のテーマは「イェーイ」でした。

f:id:aimstogeek:20180621092347j:plain

今回のLT大会の審査基準は、以下の3つです。

  • イェーイ度(NOT パリピ

  • ためになった度

  • 時間遵守(厳守、10分以内)


また、本大会には発表者ではなくとも見学者として参加でき、私は今回見学者として参加しました。

こんな内容(タイトル)の発表がありました。

  • 毎朝、日々の気付きを与えてくれる質問が飛んでくるシステムを作ってみた

 実演時の英語の質問がシュールでした。(例:What makes someone a hero?)

f:id:aimstogeek:20180620093115j:plain

  • LINEの激アツ新機能(ウェブアプリにLINEの画面を引き継げる)&陸上競技のすすめ

 「LINEの激アツ新機能」紹介より「陸上競技のすすめ」の方が熱が入っていたように感じました。

f:id:aimstogeek:20180621092427j:plain

  • 資産運用の話

 難しい話をわかりやすく紹介するプレゼン力に感服しました。

f:id:aimstogeek:20180620093252j:plain

 発音しにくい単語を何度も繰り返し、会場に笑いが起きていました。

f:id:aimstogeek:20180620093337j:plain

  • お金を借りるってどういうこと?

 お金を借りる→自己破産の流れで資産を増やすという暴力的なお話でした。

f:id:aimstogeek:20180620093413j:plain

  • 情報セキュリティマネジメント試験の問題が面白かった話

 開き直るセキュリティポリシー違反者の意見に笑ってしまいました。

f:id:aimstogeek:20180620093458j:plain

 「科捜研の女」の紹介に力が入ってたように感じました。

f:id:aimstogeek:20180620093635j:plain

  • 山手線の新駅名を考えよう

 残念ながら私はいい案が一つも浮かびませんでした。

f:id:aimstogeek:20180621092451j:plain

結果

どのプレゼンもユーモアあふれる素敵なプレゼンでしたが、優勝の栄冠に輝いたのは…

Chrome拡張機能を作ってみたyo」

f:id:aimstogeek:20180620093845j:plain

でした!

LT大会後に優勝したMatzさんにプレゼンの手応えをうかがうと

優勝の手応えはあまりなかったですね。。。

拡張機能の開発の仕方を調べている時、古い記事が多く出てきたので、

「時代遅れかも...」と感じていながらでしたね。

とあまり自信はなかったようでした。

LT大会での個人的な気付き

1. 「共感」できるテーマ

今回のプレゼンでは、機能の実演や問いかけなど、見学者側が参加できるプレゼンが多くありました。

発表者も見学者の反応をうかがいながらプレゼンを進めていっていたように感じます。

また、テーマも身近なものが多く、共感しながら聞いていました。

Matzさんに優勝の要因をうかがうと

プレゼンというよりも、「ユーザビリティを考慮した上での開発」という部分に 皆共感していただけた結果だと思いますね。

と「共感」が優勝の要因のひとつになったのではないか、との回答をいただきました。

1つ目の気付きとして、プレゼンにおいては、相手の共感を引き出すことが重要であると思いました。

2.  苦手だからこそプレゼンするという気持ち

人前に立つのがとても苦手な私は、今回は見学者としてLT大会に参加しました。

しかし、発表者として参加した人の中には、「プレゼンが苦手だから参加する」という意見も。

自他共にプレゼンが得意だと評価されるmatsBさんは、昔はプレゼンが苦手だったそうです。

「プレゼンは場数」

そう言ったmatsBさんのプレゼンは、大会の中で一番笑いを取っていたように感じます。

2つ目の気付きとして、プレゼンにおいては、苦手だからこそ挑戦するという気持ちが必要であると思いました。

終わりに

次回のLT大会は、9~10月に開催されるそうです。

それまでに共感してもらえるテーマを探して、発表者としてLT大会に参加できたらと思います。



\\『明日のはたらくを創る』仲間を募集中です!! // 919.jp

バグ修正のアプローチ(プログラミング初心者向け)

皆さん「バグ」直してますか?

特にプログラムを始めたばかりの人は見たくもないと思ってるかもしれません「バグ」。

見たくないですよね〜。わかります。

while (ture) { print("バグ"); } // つれー

そんな「バグ修正が苦手!」という方や「バグ修正なんかつまらない!」という方向けにバグ修正のアプローチを朝までには伝えることができたらと思います。
この記事を読み終わった後、きっとあなたはバグを修正したくてウズウズすることでしょう。

ちょっと長いので逆から読んでもらっても構わないです。

目次

  • エラーログを読もう
  • 再現手順を確立させよう
  • 何が原因かを考えてみよう
  • 仮説を検証しよう
  • 修正案を立てよう
  • 修正箇所の影響範囲を調べよう
  • 修正案を元に修正しよう
  • テストをしよう
  • コードをレビューしてもらおう
  • 修正をリリースしよう
  • まとめ
  • 初めまして私はCzといいます

エラーログを読もう

なんといっても、まずはエラーログを読みましょう。ここには発生した時点の情報がたくさん詰まっています。

続きを読む

初めてPMと実装の二刀流を経験して成長を実感した6つのこと

初めまして!早くも2年目になりました欲張りMatzです(☝ ՞ਊ ՞)☝ウィー

フルスタックエンジニアを目指して日々修行中でございます。 会社ではサーバーサイドエンジニアとして仕事をしています。

今から約8ヶ月前(このとき入社してから約7ヶ月)、 欲張りな私はある社内サイトのリニューアル業務にて、プロジェクトマネージャー(以下PM)を担当することになりました。 そこから成長を実感した6つのことを書きたいと思います。

その前に、担当したプロジェクトの概要と、 解決すべき問題点を共有しておきますね(☝ ՞ਊ ՞)☝ウィー


担当したプロジェクトの概要

  • リニューアルするサイトは、WordPressで開発された社内の情報共有サイト
  • コンセプトは「見やすい!探しやすい!おしゃれ!」
  • チームメンバーは計9名(依頼者は別で2名、役割重複2名)
    • インフラ周り 2人
    • デザイナー 1人
    • PM兼WP実装1人
    • フロントエンド兼WP実装1人
    • 大先輩サポート 4人
  • プロジェクト期間は6ヶ月間


解決すべき問題点

  • 検索しても欲しい記事が見つかりにくい
  • 記事を投稿するにもDBの事情で遂行しにくい
  • そもそも連語検索出来ない
  • ページ表示速度が重い

etc.

当然、欲張りMatzなので「やります!!!」とは言っては見たものの、プロジェクトというものを全く知らず、頭の中には「プロジェクトX」しか湧いてきませんでしたね。

(☝ ՞ਊ ՞)☝ウィー


とにかくがむしゃらにやって見た結果

見事に納期ギリギリでしたが上記の解決すべき問題点を解決し、付加的にこちらから提案した内容の実装を終え、 満足できる状態でリリース完了することが出来ました! 結果までの課程をすっ飛ばしていますが、一言で言うと、

大変だったけれど、チームで働くっていいな

ですね。

今プロジェクトで成長した6つのこと

1. 知ったかぶりは何もいいことがない

当初私は、「理解できない自分」が許せなく、いわゆるプライドが高い人間でしたため「分からないことを分かったふり」をしていました。

しかし、PMとして業務を遂行するにあたり、要件定義、仕様の決定、システム設計などを知ったかぶりでこなせるはずもありません。。

そんな中、別プロジェクトでPMを務めていた上司が、知ったかぶりをせずチームメンバーに純粋に質問をしている姿をみて「何も恥ずかしくないし、むしろかっこいい」と感じ、私のつまらない意地っぱりは気づけば解消されていましたね。

結果、依頼者との認識の齟齬なくプロダクトをリリースすることができました。


2. ユーザーというものを背負う責任感

最初は楽しくて設計から実装まで行なっていましたが、リリース1ヶ月前あたりになると、次の言葉が冷や汗と共に発せられたのを思い出します。

今自分が開発しているこのプロダクトを使う人は本当に喜ぶのだろうか

その時に、自己満足の虚しさを知ったような気がします。
リリース後の依頼者、ユーザーからの反応を見て、 「私の考えた最強のシステム」より「ユーザーのことを考えたシステム」のほうが依頼者もユーザーも喜んでくれることに気づきました。

相手のことを考え抜いて喜ばせることにとてもいい気分を覚えました。

これって、好きな異性と仲良くなるためにはどうすればいいか本気で考えるのと近しいと思いませんか?( ´థ౪థ)


3. チームワークを最大化させる要因は心地よいコミュニケーション

なぜチームで仕事をするのかと考えた時に、「良いものを作ることは、物理的にも精神的にも1人では出来ないから」なんじゃないかなと思っています。

そんなチームのメンバーは当然全員「人間」な訳で、人間を理解せずに円滑なコミュニケーションは望めません。

笑っていると楽しいし、それでいて真剣な仕事の相談も出来たらアイデア出まくりですし頑張ろうという気になります。それが循環しているすごくいいチームでした。

これが、一つのゴールを目指し、いいアウトプットを出すチームの「助け合い」なんだなぁと深く感じましたね。


4. 実装は、Computerとの会話

PMもやりつつ、WordPressの実装も行なったのですが、WordPressは便利と思う反面、融通が効きにくい仕組みでもあります。

自分がしたいことをComputerがわかるように記述してあげるというのが大事で、それをするためにはWordPressさんのことを知らないと出来ないことです。

結果、全てにおいて相手のことを知らないと上手くいかないということですね。

その場しのぎで書いてしまったコードから、1ヶ月後くらいにツケが回ってきましたし。。。
(☝ ՞ਊ ՞)☝ウィー(☝ ՞ਊ ՞)=☞)՞ਊ ՞) ←こんな感じ


5. スケジューリングの重要性と難しさ

今回のプロジェクトで自分に一番足りないなと感じたのが、プロジェクト全体を見通して大枠のスケジュールを組み立てることと、それを管理することですね。

自分一人の予定であれば、「気合いダァーーー!!!!」といって根性で納期を守ればいいですが、チーム全体となると話は違います。

他のプロジェクトと並行で動いているメンバーもいます。

そんな中、大先輩が大枠のスケジュールの引き方を指導してくれ、一気にプロジェクト完遂までの道のりが見えるようになりました。

今当初の自分にアドバイスをするのであれば、「プロジェクトが完了した時を具体的にイメージして、その時全てがどうあるべきかを考えろ」といいますね。

考えれば必然なものは思いつくし、足りないものは後からでも補えば良いので。


6. 要件定義とシステム設計がある程度できたらチームで認識合わせのキックオフをすべき

今プロジェクトは完全に0からのスタート(元データ以外)だったので、事前にリスクの洗い出しとヘッジ案を練るべきでした。

しかし、それをしなかった結果、行き当たりばったりの開発になった部分があり、チームに迷惑をかけてしまいました。。。

円滑にチームとして動いていくためには、スタートラインで認識の齟齬を無くし、ゴールを共有することが重要だと学びました。


最後に

6ヶ月間のPMと実装の二刀流経験を通して、PMの重要な役割とは、「相手のことを考えた上でのコミュニケーションを如何に取っていくか」なのではないかと感じています。

結果的にリリース後にユーザーからいいコメントをもらえたり、追加の依頼が来たりと、楽しい保守・運用が出来ています。

これも、相手のことを考え抜いたチームだからこそ、ユーザー、依頼者から期待をされるのだと思います。

また、PMと開発の二刀流ということで、システム設計や、工数管理も、本来「実装を依頼する人と実装を依頼される人」のどちらも経験しながらだったから円滑に進められたのかなと感じます。

結論としては、やはり勉強あるのみですね!

技術力もあり、PMも円滑に回せられるように日々努力していきます!欲張り!

(☝ ՞ਊ ՞)=☞)՞ਊ ՞)(☝ ՞ਊ ՞)=☞)՞ਊ ՞)(☝ ՞ਊ ՞)=☞)՞ਊ ՞)



\\『明日のはたらくを創る』仲間を募集中です!! // 919.jp

Fusion360を使って自社キャラを作ってみた話

初めまして!あっという間に新卒2年目になりましたmkです。

プランナーを目指すべく日々突き進んでいますo(`ω´ )o

普段からどんどん新しいことにチャレンジできる環境なので、時々振り返ってみるのですが、「忘れてしまう」ことって多いのではないかと思っています。

ソフトも使ってないと使い方を忘れてしまうので、定期的に触るの大事…!

今回、自分の勉強(大学時代の思い起こし)も兼ねて、Fusion360というソフトを触ってみたので、紹介していきたいと思います。


概要

Fusion360は、Autodesk社が提供している「3DCAD」ソフト。(CADとは

3Dモデルを作成することで、2次元で考えているものを組み立てたり、シミュレーションをしたり、3Dプリンタで出力したりすることが可能です。

www.autodesk.co.jp

というと、堅苦しい感じがするので弊社のキャラクターである「かんごるーちゃん」を作成していきます。

完成図はこんな感じ↓↓

f:id:aimstogeek:20180529175107p:plain
完成図

※3DCADソフトにもいくつかあり、私はFusion360お初でした。

※専攻が機械だったので、メカCADベースの説明の可能性がありますがご了承ください。


1.モデルを作成する

平面を選択してスケッチをします。

回転ツールや押し出しツールを使って、書いた平面を立体に。

f:id:aimstogeek:20180529174741p:plain
※今回はお試しなので寸法等は適当です…


2.コンポーネント化する(アセンブリ

シミュレーションをしたりするためには、それぞれのパーツ(コンポーネント)が組み合わさってできていることをソフトに教えないといけません。

コンポーネントを別々に作成してから組み合わせていく(アセンブリする)ものだと思っていたのですが、Fusion360は一通り作成したあとにコンポーネント指定ができるようです。

コンポーネント同士に拘束をかけて組み合わせていきます(ジョイント)。

耳・腕・足は回転できるように、ハートのオブジェクトは上下移動できるように条件設定!

f:id:aimstogeek:20180529190840p:plain
※拘束条件も適当…


3.見た目(外観)を調整する

モデルを作成しただけでは、冷たい感じのかんごるーちゃんなので、外観の調整をします。

外観だけでなく、素材を指定したりすることでシミュレーションをより実際のものに近づけることが可能です。

今回は見た目だけなので、適当に色や質感だけで決定。

f:id:aimstogeek:20180529180858p:plain
パウダーコート(黄)で代用

のっぺらぼうだと悲しいので、部品の面上に、画像をあてることができる「デカール」機能も使ってみました。

これで、最初に載せたかんごるーちゃんの完成!

f:id:aimstogeek:20180529175107p:plain
デカール


4.動かしてみる

せっかくコンポーネント化したので、「モーションスタディ」機能を使って動かしてみます。

部品がどのように動くかを表現することが可能です。

耳と腕+ハートの動きを設定。(※ジョイントの際の拘束条件が反映されます)

f:id:aimstogeek:20180529182013p:plain
心の目で動いているのイメージしてください…


5.レンダリングしてみる

Fusion360は、3.で設定した外観(素材)や環境設定をふまえてレンダリングすることが可能です。(レンダリングとは

ローカルかクラウドを選択することができ、クラウドで行うと4.で設定したモーションスタディの動きを再現してくれる様子。

レンダリングを実行…

するとかんごるーちゃんの目だけ消えてしまった。

調べると、透過処理をしている画像をデカールすると、レンダリングの際に消えてしまうことがあるようです。

f:id:aimstogeek:20180530165205p:plain
悲しい…


6.その後…

Fusion360はENTITIとのアドインでAR/VRモデルに変換できる!というのを見つけたため選んだのですが、かんごるーちゃんを変換しようとしたらソフトが落ちる。

簡単なモデルで変換してみたものの、変換データのメールがこない(サーバーで止まっているという記事を見かけた)。

ということで当初の目的だったARモデル化はできなかったのですが、3Dプリンタでグッズを…!などと期待が膨らんだので結果的にはとても良い機会でした。

Fusion360は今回紹介した機能の他に、シミュレーションや図面に起こすことができます。

ぜひ、興味がある方は体験版等アカウントの種類も複数用意されていますので、お試しください(╹◡╹)


まとめ

一言でまとめると、

前に進むことも大事ですが、たまには振り返ることも大事!というお話でした。 (1年目の学びのひとつ)



ということで、

\\『明日のはたらくを創る』仲間を募集中です!! // 919.jp