【制作事例】ペッサリー情報サイト

 
ふだん病院や、クリニックなどのホームページを作らせてもらうことが多い弊社ですが、
今回は少し珍しい事例で、医療器具(ペッサリー)の情報サイトを制作しました。

「知ろう!ペッサリーのこと」
http://pessary-info.jp
img_pessary

PC/スマートフォンに対応しています
 

ペッサリーと言うと一般的には避妊具のイメージがあるかもしれませんが、
現在の主な使われ方は、子宮脱などの骨盤臓器脱の治療です。

患者さまはもちろん、医療関係者にも
ペッサリー(およびリングペッサリー)について正しい知識と理解をもってもらえるよう
情報発信をしていきたい、という目的で
企画の初期段階からお話をいただき、
弊社で、わかりやすいサイトタイトルやドメイン名も提案させていただきました。
 

掲載されている情報はまだ多いとはいえませんが、
サイト公開後も、少しずつ追加更新しています。
スマートフォン版では
Sidr.jsというプラグインを利用して、
横からスライドしてくるメニューを作成しました。

img_sidr

Sidr.js は特に難しい設定もないので、
CSSをちょこっと上書きした程度で、基本的にはそのままで使用できました。

最新版(v1.2.1)は、Androidで「子要素の最初のリンクURLに勝手に遷移してしまう」
というバグがあるようで、
少し古いバージョン(v1.1.1)を使っています。
 

管理しやすい!使いやすい!フォーム設計の重要なポイント

 
img_01
こんにちは。デザイナのTです。この方は千葉西総合病院の井上様です。
こちらの井上様にはるばる弊社までご足労いただき、
お問い合わせ・採用フォームのシステムについての講義をしていただきました。

 
img_02

システム部、病院チーム総出で会議室はぎゅうぎゅう。ちなみに社内飲み会の時もこんな感じです。

 
さて、弊社でもほとんどのWEBサイトにフォームを取り入れておりますが、
そもそもフォームを取り入れることのメリットって何でしょうか?

・お客さん(ユーザー)が時間、場所を選ばずすぐに質問ができるという手軽さ
・受け手(管理者)がそれらの質問をパソコンにデータとして保存しておける確かさ

例えばこういった点が挙げられると思います。

もちろん、ただデータを溜めるだけでは何も進みません。
ここで重要になるのが、データの「管理法」と「操作法」です。

 

「管理法」データの共有

img_03
例えば、ある担当者のパソコンのメーラーだけで管理していた場合。
担当者が変わり今までのやりとりのデータがなくなってしまうと、
また一から同じ返答をしてもらわないといけない、ということになってしまいます。
容量も悪い上にユーザーにとっても面倒です。
img_04
しかしこのやりとりの履歴が共有のサーバにあれば、
誰でもログを確認できるので前後の流れを把握できる、ということですね。

 
img_05
また井上様曰く、病院宛てにくる問い合わせは何度も質問されるものが多いそうです。
通常勤務で忙しい先生方をその都度つかまえて答えを尋ねていたらキリがないですよね。
こうした時も、「以前同じような質問を受けた」という履歴が残っていれば
その時の対応に習って対応することができます。
ムだなやりとりをせずに済むので、ストレスも軽減されますね!

 

「操作法」データの扱い

前述の通り、病院の先生方は基本的にお忙しいので、
いかにデータを取り扱いやすくして素早く対応できるかも重要なポイントです。
img_08
例えばひとつの問い合わせに対し、以後のやりとりをスレッドで管理できると行動の流れがわかりやすくなります。
特に複数人で管理する場合は、一見で流れを把握させることが大事ですよね。
img_06
また、問い合わせに対してアクションを行ったかどうか、
確認が必要な場合などにメモを残すといった機能をつけることで、サーバ内でのやりとりだけで状況を共有することができます。
更に問い合わせの文章中のキーワードに対する解説を辞書機能として登録しておけば、
何度も尋ねられる質問に対してもすぐに回答することができます。

 

ついついフォームそのものの使いやすさにばかり注視してしまいがちですが、
それらのデータを管理する「ウラ側」のシステムの使いやすさの重要性について、認識を改めることができた講義でした。

貴重なお時間、ありがとうございました!

【制作事例】HTML5によるアニメーションとゲーム

昨年11月にJAセレサ川崎様のHPリニューアルの制作をさせていただきました。
PC/スマートフォンに対応しています。

セレサアニメ

http://www.jaceresa.or.jp/
PC版のトップページのメインビジュアルは
川崎の臨海部〜都市〜里山を気球でめぐる楽しいアニメーションになっています。
ポイントは多重スクロールによる奥行き感と、それがきちんとループでつながっている点です。
気球も動かせます!

 

また、せっかくリニューアルするなら、利用者が楽しめるようなコンテンツを作りたい、というご要望があったので
同じイラストを利用して、オリジナルゲームの制作をご提案しました。

game02_ol
「旬の野菜をキャッチ!GO!GO!CERESA!」
http://www.jaceresa.or.jp/game/

飛んでくる野菜を時間内にできるだけ多くキャッチする!という単純なゲームですが、
季節によって高得点のアイテムが変わったり、ハイスコアランキングがあったりします。
スマホ版もあるので遊んでみてください。

 

何年か前だと、Flashで制作するところですが、
HTML/CANVAS/Javascriptでの制作となるとちょっと手間がかかります。
最近は逆に、ホームページ内でこういったコンテンツを見かける機会が減ったかもしれないですね。

【目指せ脱・カメラ初心者】一眼練習、始めました。 ~カメラ紹介① Nikon D750~

こんにちは、デザイナのTです。

年が明けて早くも1ヶ月が経ってしまいました。

遅ればせながら、今年もよろしくお願いいたします。

さて、弊社には現在3台のカメラがあります。

複数名で撮影行くことがあったり、同じ日に別の撮影がカブっていたりするので

様々な条件によって使い分けているようです。

そこで、複数回にわたり、これらのカメラを簡単にご紹介していきたいと思います。

ちなみにご紹介するカメラのラインナップはこちら。

  • Nikon D750
  • Nikon D800
  • Nikon D4s

今回は、Nikon D750についてのご紹介をします。

Nikon D750の特徴

img_00

こちらのD750は3台の中でも比較的扱いやすい万能なカメラで、

私のような初心者でも、「シャッター切っときゃなんとかなる(by 社長)」写真を撮ることができます。

D750はアタマの回転が良いので、オート設定でも周囲の状況をサッと認知して

うま~い具合に光量やバランスを調整してくれるんですね。なので初心者にも優しいのです。

img_01

そして注目すべきはこの可動式液晶モニター。

モニターを動かすことができるので、ファインダーを覗かなくとも俯瞰やあおりの写真を自由に撮ることができます。

img_02

こんなかんじで撮っています。

Nikon D750で撮ってみる

せっかくなので、この可動式液晶モニターを活かして俯瞰やあおりの写真を撮ってみたいと思います。

まずは俯瞰の写真から。

img_03

弊社オフィスの様子です。

ふみ台不要でこの目線!広角レンズとの相性もバツグンです。

そしてお次はあおりの写真。

img_04

題して「ルンバの目線」です。

そびえたつ空気清浄機が帰路を邪魔しているのでしょうか。

お陰でここ最近、ルンバが帰還前に力尽きている光景をよく目にします。

img_05

あともうすこし・・・

Nikon D750 まとめ

可動式液晶モニターによって、目線を変えた写真を簡単に撮ることができるNikon D750。

迫力のある写真を撮りたい時に重宝しそうですね。

次回は、Nikon D800についてご紹介したいと思います。