【必見】アニメーションでDekiroute[デキルート]を大改造した結果、明確になった「目的」と「手段」

　
こんにちは、だーつです。
今年初投稿です、あけましておめでとうございます！
今年も宜しくお願い致します。

いきなりですが、目的と手段を取り違えることってよくありますよね。

例えば
・大学の講義
よくある間違った目的：単位を取ること　
本来の目的：知識や教養を身につけること

・アルバイト
よくある間違った目的：店長に嫌われないこと
本来の目的：お金を稼ぐこと

・恋愛
よくある間違った目的：彼女を作ること　
本来の目的：愛を育むこと

このように
目的と手段を取り違えてしまうことってよくあります。

実は私もこのDekiroute[デキルート]のサイトを制作する上で
目的と手段を取り違えてしまいました。

今回はその時の取り違えを例に
目的意識(狙いを持つこと)の大切さを伝えます。
　
　
　

アニメーション大好き勘違いエンジニアが犯した間違い

もともと私はアニメーションが大好きなエンジニアです。
小学生の時の、パワーポイントのアニメーションへの感動が今でも忘れられません。

　　こんなのとかありましたよね！　　

　　これとか！　　

　　これが一番お気に入りです！

僕の中では アニメーション = おしゃれ・かっこいい でした。

それもあって
Dekiroute[デキルート]を6月に公開した後、
2カ月後くらいのことです。
私はこのサイトにアニメーションを導入しようと

動きました。

(アニメーションなだけに)

その際に私が設定した目的は、
「Dekiroute[デキルート]にアニメーションを導入することでこのサイトをおしゃれにカッコよくしてやる！」

なにはともあれ、その際に作成したサイトを見てください！
http://www.inden.ne.jp/dekiroute/animate

どうでしょうか、皆さん。
今見ると、自分でも恥ずかしいくらいの出来栄えです。

当時はこれが
オシャレでかっこいい今風なデザインだと勘違いしていました。。。
このバズりをきっかけに、Dekiroute[デキルート]も一躍トップメディアに！と信じていました。。。

ただ、これで上司のデザイナーへの提案が通るわけもありませんでした。
その理由は１つです。
「手段であるはずのアニメーションが目的化してしまっている」ことでした。
　
　
　

手段ではなく、目的を明確にしたアニメーションデザイン

そこで今一度目的を見直しました。
先程の目的は
「Dekiroute[デキルート]にアニメーションを導入することでこのサイトをおしゃれにカッコよくしてやる！」

しかしそもそも、これは目的ではありませんでした。
アニメーションを導入するということは手段です。
重要なのは導入して、なにを実現させるのか。

最終的な目標は
Dekiroute[デキルート]を訪れたユーザに多くのページを見てもらうこと、
つまりPV(1回訪れたユーザが見るページの数)を増やすことです。

そのために
アニメーションを使って快適にサイトを回遊してもらうことが一番の目的だったのです。
そうです、「オシャレでかっこいい」はこのブログメディアにおいては
必要なかったのです。

そこで新たに設定した目的は
「Dekiroute[デキルート]にアニメーションを導入することでこのサイトを見やすくする！」

以下が完成したサイトです。
http://www.inden.ne.jp/dekiroute/animate2

どうでしょうか、皆さん。
前回よりは見やすさが向上したのではないかと思います。
　
　
　

まとめ

以上からわかるように
目的と手段を取り違えると、全く異なったものができてしまいます。

目的が正確でなければ
最終の目標に達するわけもありません。

せっかくスキルがあってもそれを「正しい目的」のために使わなければ意味がありません。

最終の目標に達するための目的として
アニメーションを手段としたのが今回の例でした。

ちなみに今回アニメーションを導入したサイトが
本サイトで採用されていないのは、
アニメーションで見やすくするよりもサイトの表示スピードを上げる方の
優先度が上回ったからです。
(実はアニメーションはサイトの表示スピードを遅くしてしまうというデメリットがあるんです。)

皆さんも目的と手段の取り違えには気をつけてくださいね！
オシャレかっこいいは目的ではないですからね。
　
　
　

おまけ

どうしてもアニメーションが見たいという方に
隠しコマンドを提供します！！(パソコンのみの機能となります)
どのページでも下記のコマンドを入力することで
今回制作した2つのサイトに飛ぶことができます。
せっかくなのでどんどんアクセスしてください！！
＊削るとコマンドが見えますよ！

目的「Dekiroute[デキルート]にアニメーションを導入することでこのサイトをおしゃれにカッコよくしてやる！」

目的「Dekiroute[デキルート]にアニメーションを導入することでこのサイトを見やすくする！」