ODIN リアルタイム配送システムの管理画面のデザインをリニューアルしました

じゃじゃん。

本日、ODIN リアルタイム配送システムの管理画面のデザインをリニューアルしました。

どんなふうになったかというと、

<リニューアル前>ODIN リアルタイム配送システム リニューアル前のリアルタイムマップ

<リニューアル後>

リニューアル後 リアルタイムマップ

「え?どこが変わったの??」

と言われそうですが、地味ではありますが小さいPCで見たときや、スマホ・タブレットで見たときの画面が見やすくなったのと、上部のメニューがシンプルになったのです。

今までも、画面は

「使いやすい」

と評判を頂いていましたので、既存のお客様の使い勝手をなるべく損なわないデザインになっております!!

ログイン画面はだいぶ変わりました。

<リニューアル前>

ログイン画面

<リニューアル後>

ちょっとこれは、お客様を驚かせてしまうかもしれませんね。しかし、いらない要素をだいぶ省いたので、シンプルで使い勝手の良いものになったと自負しております。( ˊᵕˋ )

このログイン画面が今までと違いすぎて、私がこの画面を作っている間、弊社の社員さんが

「なんかよくわからないシステムのログイン画面を後藤さんがずっと見ている。

きっとパスワードを忘れてログインできないんだろうなぁ…。」

と思っていたらしいです。(笑)

 

デザインに関しては私が担当しており、デザインの絵を作っただけでなく、今回CSSとかもだいぶ私自身が編集しました…。

モバイルファーストということで、スマホでこの画面を見る方に使いやすく、というのが今回のテーマの一つでして、Bootstrap3からBootstrap4になりました。

それに伴いjQueryもバージョンアップしましたので、裏はかなり変わったわけです。

なので、全ページを目視で確認したりしました…。全部で146個もお客様が入力したり見たりするページがありまして、大変でした。(´ω`)

 

今回のデザインのポイントとしては、画面右上の

オーディーンの槍

「ここ!」(ゴー☆ジャス様みたいに再生してください。)

に注目してください。

PCでないと出てこないです。

ODIN リアルタイム配送システムのシリーズのロゴも槍がモチーフですが、ここにも槍を入れました。( ˊᵕˋ )

最初これはなかったんですが、ないデザインをS課長に見せたときに

「なんか堅苦しいデザイン~。ほかのシステムと変わりない~。遊び心がない~。」

と言われましたので、つけました(笑)。

 

ODINという製品名は、北欧神話の神、「オーディーン」からとりました。この槍は、オーディーンの持っている槍の「グングニル」という槍のイメージです。

決して的を外さないそうです。⊂(^-^)⊃

配送業の皆様に、「決して的を外さない」お仕事をしていただきたい!というイメージです。

 

ここをクリックすると、リアルタイムマップに飛べます。リアルタイムマップというのは、ドライバーさんの位置情報が地図上でリアルタイムに更新される画面です。

やはり皆さんが一番アクセスする画面なんですよね。なので、ここに配置することで、アクセスもしやすくなるわけです!

これからも、ODIN リアルタイム配送システムをよろしくお願いいたします。

One thought on “ODIN リアルタイム配送システムの管理画面のデザインをリニューアルしました

  1. 後藤様

    お元気ですか?
    與儀@沖縄です。

    僕が在籍していた頃(2009年4月〜2011年6月)は、
    ホームページ(html+css)作成から、
    Wordpress のデザインと開発への移行時期だったと思いますが、
    当時は、後藤さんがほぼ全てデザインをされていたかと思います。

    デザインしているときの
    静止画を集中して見つめる後藤さんの表情、
    今でもよく覚えてます。

    なので、以下の記述を見た時に、
    その光景がリアルに浮かんできて。。

    懐かしくもあり、少し笑った後、
    なんだか泣けてきました。。

    「なんかよくわからないシステムのログイン画面を後藤さんがずっと見ている。
    きっとパスワードを忘れてログインできないんだろうなぁ…。」
    と思っていたらしいです。(笑)

    ( ̄▽ ̄)

    沖縄はコロナ感染の勢いが止まらず、
    毎日、感染者数最多更新の記事を目にします。

    横浜もきっと大変かと思いますが、
    収束しない災禍はないと信じて
    乗り越えていきたいものです。

    またいつの日か
    お会いできる日を楽しみにしています。

    與儀

コメントを残す