%#!platex -kanji=%k
%#DVIPDF dvipdfmx -f ipa.map
¥documentclass{jsbook}
%¥pagestyle{empty}
¥usepackage[dvipdfmx]{graphicx}
%¥usepackage{listings, jlisting}
%¥usepackage[sectionbib]{chapterbib}
¥usepackage{ascmac}
¥usepackage[twoside,inner=30truemm,outer=20truemm]{geometry}
¥usepackage{url} % 文中にURLを書くときは ¥url{} で括る
¥geometry{textwidth=160mm, textheight=225mm}
¥renewcommand{¥bibname}{参考文献}
¥title{買い物弱者支援の移動販売車と連携したモバイルオーダーシステムの提案}
¥author{児玉一真}
¥date {令和6年1月10日}
¥begin{document}
¥maketitle
¥tableofcontents
¥clearpage
現在，買い物弱者向けの移動販売車が注目されている。移動販売車は主にオフィス街やイベント場所，大型スーパー前などの集客が望む場所で販売しているが，近年では買い物弱者支援のための事例が増えている。現地民からは「近くに来てくれて助かる」という喜びの声がある。しかし，近年の燃料費の増加や移動販売車の数量の制限により商品の単価の増加や欲している商品がないという問題点がある。実際，買い物弱者用移動販売車の事例の一つであるローソン移動販売サービスは35都道府県に約100店舗を展開している。だが，移動販売と店舗とで同じ売価になっており燃料費などの原価がそのまま影響するため，購入品1品につき手数料をいただく試みも開始されている現状である。そこでモバイルオーダーと移動販売車との連携を考えた。モバイルオーダーとは顧客自身のモバイル端末から注文・決済を行うことができるシステムである。注文内容にミスが発生しにくいことや他の客を気にせずじっくり注文できると言った点から，満足度が高い。利用者の多くは高齢者だが，モバイル端末の所有率やインターネット利用状況などは軒並み増加している状況である。高齢者にとってののモバイルオーダーを使うことで1回の移動販売で多くの商品を売り，商品の単価の増加や欲している商品がないという問題の解決を目指す。(559字)
¥chapter{はじめに}
¥section{背景}
現在，買い物弱者用の移動販売車が注目されている。移動販売車とは店舗以外のとこへ自動車などで運んできた商品を販売する小売業である。販売場所は主にオフィス街やイベント場所，大型スーパー前などの集客が望む場所で販売しているが，近年では買い物弱者支援のための事例も増えている[1]。買い物弱者とは住んでいる地域の過疎化が進み商店街の衰退や交通網の弱体化したほか，足腰が弱くなって日用品等の買い物が困難である人々のことである。事例の一つであるローソン移動販売サービスは35都道府県に約100店舗で展開している[2]。移動販売の訪問先のうち9割近くは高齢者施設に対して販売を行っている。とくし丸では徳島県にて「買い物に困る」高齢者を対象として開始された。全国で142社のスーパーと連携し，約16万人の顧客に利用されており，無くてはならない存在となっている。しかし，これらの移動販売の問題点の一つとして，燃料費が問題となっている。2023年9月の時点でレギュラーガソリン価格高騰により，全国平均で1リットルあたり186.5円となっている。これは1990年以降で最高値であり，トラックやトレーラーで長距離輸送を行う富山市の運送会社では，利益が昨年度の同じ時期に比べおよそ3割も減少するなど燃料費が経営を圧迫する状況になっている[3]。そのようなことから，移動販売では商品を値上げすることで利益を保っている。さらに武市の研究によって一度に販売に出発すると商品の補充ができないため，最後の方の地点では商品が少なくなっているという欠点が挙げられた[4]。そこで近年注目されているモバイルオーダーの活用を考えた。モバイルオーダーとは顧客自身のモバイル端末から注文・決済を行うことができるシステムである。注目されている点として，注文内容にミスが発生しにくいことや他の客を気にせずじっくり注文できると言った点から，満足度が高い[5]。問題点の解決策としてモバイルオーダーを使用することで事前に顧客の必要としている商品を認知することができる。これにより不必要な商品を減らし，燃費を良くすることができると考えた。さらに，移動販売車の多くは高齢者の利用であるが高齢者の多くはモバイル端末を所持している。令和4年の調査では60代が約83％，70代では約60％，80代では約30％と多くの人が携帯端末を持っている。また，令和4年度のインターネット利用状況では，60代では約87％，70代では約65％，80代は33％と，80代は少ないが多くの人が利用している [6]。以上のことから，モバイルオーダーが有効だと判断した。
¥section{目的}
本研究はモバイルオーダーと移動販売車が連携することによって事前に欲している商品を移動販売車側が認知できることを目的としている。また，買い物弱者向けに作成するため高齢者に優しいシステム設計を目指す。
¥chapter{先行研究}
¥section{高齢者のシングルタップ時間}
大塚らの研究では，高齢者がモバイル端末を使用する際にシングルタップと呼ばれる，タッチペン，指，マウスで操作した場合にシングルタップの間ではどれだけの時間の差が発生しているか研究を行った[7]。高齢者197名を対象に14インチのタッチパネル上の1024*768pixelの長方形フォームをできるだけ早くタップするという実験である。また，実験結果からタッチペンが最も早く，指，マウスというような順番となった。課題として年齢によってタップ時間と有意な正の相関が見られ，加齢に伴いシングルタップという基礎的なタッチインターフェースにおいても認知負荷は増大するというものが挙げられた。
¥section{高齢者においてのハイテク家電}
福田の研究では，近年の家電製品の高機能化に伴い，高齢者が順応しているのか研究を行った。59歳から71歳の被験者計5名を対象に5つの炊飯器を再現した17インチのタッチパネルディスプレイ上で操作を行ってもらう[8]。その際に，眼球運動測定装置と生体信号測定装置を使用し，取得したデータから比較実験を行った。実験結果から類似したネーミングのボタンは区別するのが難しく，被験者が混乱してしまうという考察がされた。また，時刻設定ボタンを使用する際に上向きの三角形▲は時刻を「進める」，下向きの三角形▼は時刻を「戻す」というものだが，被験者は思っていた方向と逆に動かしてしまうということがあった。そのため，より直感的なデザインが必要になるという課題が残った。
¥section{先行研究からの問題提起}
1つ目の先行研究ではモバイル端末を使用する際にシングルタップというものでも認知負荷は増大するという課題が挙げられた。2つ目の先行研究ではデザインの問題により被験者が思っていた方向と逆に動かしてしまうというものがあった。これらの課題点から本システムは注文までの流れの手順が少なく，ボタンが直感的である設計が必要だと考えた。
¥chapter{システム設計}
¥section{システム概要}
本システムはモバイル端末から日用品や食品等を注文できるシステムである。はじめに番号の入力を促し，送信させる。その後,本システムの「使い方」，「メニュー表」，「注文はこちら」の3つに遷移を行う設計とする。注文画面では，購入者が高齢者ということを考慮し,入力してもらう事項は「数量」，「注文を確定する」，「商品を削除」，の3つのみの設計とする。注文を確定するボタンを押すことでサーバ側に注文内容が送信される。また購入者の識別は注文内容が送信されるタイミングで同時に入力を促した番号が送信されるようにした。サーバ側に注文内容が送信される技術はWebSocketを利用した。外部からのアクセスはapacheを利用した。
¥begin{figure}[htbp]
¥centering
¥includegraphics[width=10cm]{soturon.drawio.pdf}
¥caption{システム概念図}
¥end{figure}
¥section{WebSocketサーバー}
WebSocketとはWebサーバとクライアントとの間の双方向通信を行う通信プロトコルの一つである[9]。この技術の利点として，常時接続しているため自身にとって都合の良いタイミングで通信ができる。本システムでは顧客からサーバ側に注文を送信する際に使用する。送信される内容は購入者識別番号，商品の名前，個数，値段の4つとした。
¥section{Apache}
Apacheとは世界的に人気の高いオープンソースのWebサーバソフトウェアの一つである[10]。正式名称はApacheHTTPServerであり，無償で誰でも使用できることや処理速度が速い，拡張機能が豊富であることなどが特徴として挙げられる。本システムではWebサイトへのアクセス，WebSocketサーバにレスポンスを送信する際に使用する。
¥chapter{実装}
¥section{使用技術}
¥begin{quote}
¥begin{itemize}
¥item WebSocket
¥item Apache 2.4.58
¥item Visual Studio Code 1.68.1
¥item Html
¥item Javascript
¥item Ruby 2.6.10
¥end{itemize}
¥end{quote}
¥section{Webサイトへのアクセス}
Apacheの設定はポート番号をデフォルトの80，Documentrootと呼ばれるWebサーバを外部に公開するディレクトリをWebSocketサーバー及びhtmlファイルが置いてあるディレクトリを指定しアクセスできるようにした。またProxyPassを設定し，リバースプロキシと呼ばれる外部からのリクエストをWebSocketサーバに中継を行るようにした。さらにDocumentrootで指定したディレクトリを全てのアクセスを許可し，外部からのアクセスを可能とした。
¥section{WebSocketサーバの構築}
WebSocketサーバの作成にはrubyを使用した。ポート番号は8888とした。注文画面にアクセスするとクライアント側に通知が送信され，アクセスしている数が視覚化できるようにした。切断した際にはカウントしている人数から1人減らすようにしている。注文内容が送信されるとjavascriptからjson形式で受信され，データベースに各データが送信されるのと同時にサーバ側に注文内容の送信，javascriptに「注文しました」と文章を送信されるようにした。
¥begin{itembox}[c]{WebSocketサーバー}
¥scriptsize{
¥begin{verbatim}
require 'em-websocket'
require 'set'
require 'json'
require 'sqlite3'
db = SQLite3::Database.new "sample.db"
PORT = 8888
clients = Set.new
EM::WebSocket.start({:host => "0.0.0.0", :port => PORT}) do |ws_conn|
ws_conn.onopen do
clients << ws_conn
printf("%d 入室数(s)¥n", clients.length)
end
ws_conn.onclose do
clients.delete(ws_conn)
printf("%d 入室数(s)¥n", clients.length)
end
EM::defer do
loop do
line = gets
clients.each{|conn| conn.send(line.chomp) }
end
end
end
¥end{verbatim}
}
¥end{itembox}
¥section{データベース}
データベースを作成し，データを入れるテーブルを作成した。テーブルにはnum,name,quantity,moneyの4つのカラムを設定し，numには購入者識別番号，nameには商品の名前，quantityには商品の個数，moneyには金額のデータが送信される。
¥begin{itembox}[c]{データベース}
¥scriptsize{
¥begin{verbatim}
ws_conn.onmessage do |json_message|
begin
puts "Received message: #{json_message}"
message = JSON.parse(json_message)
message.each do |message|
db.execute("INSERT INTO show_table (num,name,quantity,money) VALUES (?,?,?,?)",
message['num'],message['name'],message['quantity'],message['money'])
end
clients.each{|conn|
if (conn == ws_conn)
conn.send("注文しました")
else
conn.send(resp)
end
}
rescue JSON::ParserError => e
puts "Error parsing JSON: #{e.message}"
end
end
¥end{verbatim}
}
¥end{itembox}
¥section{各画面}
ここでは本システムの各画面の説明をする。本システムでは，購入者番号識別画面，ホームページ，使い方画面，メニュー画面，注文画面の5つの画面を作成する。
¥subsection{購入者識別番号入力画面}
購入者識別番号入力画面では数字のボタンを押下されるとその数値がセッションストレージに保存される。セッションストレージとはセッション中に一時的にデータを保存する仕組みである[11]。セッションストレージに保存された数値は送信ボタンを押下するとホームページに送信される。また，送信するボタンを押下するとアラートでクライアントに入力した番号を知らせる。
¥subsection{ホームページ}
ホームページではslide-animetionを使用し，商品のスライドショーを表示した。現在は著作権がない野菜の画像が表示されているが，実際に使用する際にはその移動販売の商品を表示することを想定している。画面中部に注文画面に遷移するボタン，画面下部に使い方とメニュー画面に遷移するボタンを配置した。また，購入者識別番号入力画面から送信されたセッションストレージの数値を取得し，画面上部に表示した。さらにその数値を注文画面に送信した。
¥subsection{使い方画面}
使い方画面では実際に注文するまでの流れを記載した。全５ステップに分けて画像と文章を使用し，説明している。画面下部にホームページとメニュー画面に遷移するボタンを配置した。
¥subsection{メニュー画面}
メニュー画面ではジャンルごとにアコーディオンメニューを配置した。押下すると商品の画像と横に商品名，値段，産地を表示した。画面下部にホームページと使い方に遷移するボタンを配置した。
¥subsection{注文画面}
注文画面ではメニュー画面と同様にジャンルごとにアコーディオンメニューを配置した。各メニューに商品名，産地，値段を配置し，数量は入力を促すようにした。注文内容の送信と選択した商品の削除はアコーディオンメニューの上に配置した。数量を選択すると画面上部に選択した商品の名前，数量，金額を表示するようにした。「注文を確定する」ボタンを押下するとアラートが表示され，商品があれば「注文を確定しました」，商品がなければ「注文がありません。」と表示される。注文内容が送信されると購入者識別番号，商品の名前，数量，金額がそれぞれ，number,menuName,quantity,menuPriceという変数として渡される。さらに変数をデータベースのカラム名に直し,messageという変数に入れ,json形式してwebsocketサーバに送られる。この時,セッションストレージに保存したものをwebsocketサーバに送り,このセッションストレージに保存した内容を画面上部に表示している。また,「商品を削除」ボタンを押下するとすべての商品の選択が削除される。同時にセッションストレージにあるものがすべて削除するようにしている。
¥begin{itembox}[c]{注文内容の送信と表示と削除}
¥scriptsize{
¥begin{verbatim}
function submitOrder() {
var ordersStack = JSON.parse(sessionStorage.getItem('ordersStack')) || [];
if (ordersStack.length > 0) {
sendOrdersToServer(ordersStack);
sessionStorage.removeItem('ordersStack');
alert("注文が確定しました。");
} else {
alert("注文がありません。");
}
}
function push(ev) {
if (!conn) initConn();
var flexContainer = ev.currentTarget.closest(".flex");
var number = sessionStorage.getItem('selectedNumber');
var menuName = flexContainer.getAttribute("menuname");
var menuPrice = flexContainer.getAttribute("menuprice");
var quantityInput = ev.target.parentElement.querySelector("[name='quantity']");
var quantity = quantityInput.value;
var selectItemr = document.getElementById("selectdItemStack");
if (!selectItem) {
selectItem = document.createElement("div");
selectItem.id = "selectdItemStack";
document.body.appendChild(displayContainer);
}
var selectclear = document.createElement("p");
selectclear.textContent = "選択された商品: " + menuName + " - 数量: " + quantity + "- 価格: " + menuPrice;
selectItem.appendChild(selectclear);
var message = {
num: number,
name: menuName,
quantity: quantity,
money: menuPrice
};
var ordersStack = JSON.parse(sessionStorage.getItem('ordersStack')) || [];
ordersStack.push(message);
sessionStorage.setItem('ordersStack', JSON.stringify(ordersStack));
}
function deleteItem(ev) {
sessionStorage.clear();
var selectItem = document.getElementById("selectdItemStack");
if (selectItem) {
selectItem.innerHTML = "選択された商品はこちら";
}
}
function sendOrdersToServer(message) {
if (conn) {
conn.send(JSON.stringify(message));
} else {
alert('WebSocketが初期化されていません。');
}
}
buttons.forEach(function(button) {
button.addEventListener("mousedown", push, false);
});
deleteButton.addEventListener("click", deleteItem, false);
submitOrderButton.addEventListener("click", submitOrder, false);
initConn(); ¥end{verbatim}
}
¥end{itembox}
¥begin{figure}[htbp]
¥centering
¥includegraphics[width=15cm]{tyumon}
¥caption{注文画面}
¥end{figure}
¥chapter{実験}
本章では作成したシステムを使用し実験を行い，本システムの有用性の有無を検証する。実験の概要と手順を以下にまとめ,実験結果から専門的な知識がない人でも扱える機能性について考察する。
¥section{実験の概要}
実験では，作成したシステムを使用してもらい使用感をアンケートで答えてもらう。計10個のアンケート項目の結果から分析を行う。アンケート項目の内8つは，はい，おおむねあてはまる，おおむね当てはまらない，いいえの4段階評価を行う。残りの2つは自由記述とする。アンケート項目は以下の通りである。
¥begin{quote}
¥begin{itemize}
¥item 注文の流れはわかりやすかったですか
¥item 商品の選択や数量の選択は簡単でしたか
¥item 使い方は分かりやすかったですか
¥item メニューは見やすかったですか
¥item 商品の情報は十分でしたか
¥item ボタンやメニューの配置は直感的でしたか
¥item 注文内容を変更する場合、容易にできましたか
¥item キャンセルしたい場合、容易にできましたか
¥item メニューにはどのような情報がほしいですか
¥item ほかにどのような機能があれば良いと考えましたか
¥end{itemize}
¥end{quote}
¥section{実験結果}
今回の実験では同研究室が8人，他研究室が1人，大学院生が1人の計10人を対象とした。アンケート結果から，多くの項目は「はい」の人数が過半数を占めた。特に評価が良かったものはメニューの見やすさとキャンセルの容易な部分だった。一方で商品の情報は「おおむね当てはまる」が6人いるが，「はい」の人数が1人というような結果となった。
¥begin{table}[tbp]
¥caption{アンケートの結果}
¥label{table:add}
¥centering
¥begin{tabular}{|l|l|l|l|l|}
¥hline
アンケート項目&はい &おおむねあてはまる & おおむね当てはまらない&いいえ ¥¥
¥hline
注文の流れはわかりやすかったですか&5&2&3&0¥¥
¥hline
商品の選択や数量の選択は簡単でしたか&8&2&0&0¥¥
¥hline
使い方は分かりやすかったですか&7&3&0&0¥¥
¥hline
商品の情報は十分でしたか&9&1&0&0¥¥
¥hline
注文内容を変更する場合，容易にできましたか&1&6&1&2¥¥
¥hline
キャンセルしたい場合，容易にできましたか&7&2&0&1¥¥
¥hline
¥end{tabular}
¥end{table}
¥begin{table}[tbp]
¥caption{アンケートの結果}
¥label{table:add}
¥centering
¥begin{tabular}{|l|l|}
¥hline
アンケート項目& ¥¥
¥hline
メニューには他にどのような情報がほしいですか&賞味期限・消費期限(6)，グラム数の表記(5),保存方法(2)¥¥
&セットか単品の値段かわからない(3)，商品の状態(2)¥¥
¥hline
ほかにどのような機能があれば良いと考えましたか&いつ届くのか(4),最初の数字選択が何のものかわからない¥¥
&移動販売車の位置情報(2)，商品ごとに削除できる機能(3)¥¥
¥hline
¥end{tabular}
¥end{table}
¥section{考察}
最も評価されたのはメニューの見やすさ，キャンセルの容易さである。メニューのほうはジャンル分けしている点や商品の画像が大きい点から評価されただと考える。キャンセルの容易さは，一括ですべて選択した商品が消えてしまう点が評価されたと考えた。また，商品や数量の選択や使い方のページ，ボタンやメニューの配置の直感的だったかというアンケートも同様に高評価であった。要因として商品や数量の選択とボタンやメニューの配置は直感的だったかのアンケートではメニューの見やすさや押下するボタンが少ないことが考えられ，使い方のページでは注文までの手順が少ないことから分かりやすさに影響したと考えた。一方で注文内容の変更の容易さが，「おおむね当てはまらない」を4人回答した。原因として一番下の機能の要望にもある通り，商品ごとに削除できる機能がほしいとのことだった。注文の流れのわかりやすさでは初めの番号選択が意味がわからなかったとのことで，使い方をはじめに見せて欲しいとの声があった。この問題点は画面を表示の順番を変えることで解決できると感じた。最も「はい」が少なかった商品の情報は十分だったかというアンケートでは賞味期限・消費期限やグラム数の表記がほしいとの声が多くあった。賞味期限やグラム数などは注文内容に表示し，メニュー表に詳細な情報を載せることで問題を解決できると感じた。これらの結果から過半数は良い評価を頂くことができ，残った問題点を解決することで有用性は十分にあると考えた。
¥chapter{結論}
本研究では燃料費の高騰や数量の制限により買い物弱者用の移動販売車の商品が高くなってしまっている点や最後の方の地点では商品が少なくなっているという問題点を解決するため，移動販売車と連携したモバイルオーダシステムを作成した。注文までの流れの単純さや直感的なボタン配置を重視した設計を行った。実験結果としてアンケート項目の過半数は良い評価をもらうことができたが，メニュー情報の不十分さや注文までの流れの不明点など問題点が上がった。これらを解決することで本システムの有用性は十分にあると結論付ける。
¥chapter{今後の展望}
まずアンケート結果から頂いた意見を参考に，メニュー表や注文までの流れの設計を見直すことが先決だと考えた。さらに本システムではWebページの空白の部分が多い点があるため，広告の挿入やおすすめ商品の紹介などユーザインターフェースの向上を目指して行きたい。また，本システムは誰でも接続できるため必要のない注文をするいたずらや適当な注文を何回も行うdos攻撃などのセキュリティの面が危うい点がいくつもある。その点を徐々に強化していきたいと考える。
¥chapter*{謝辞}
本研究を進めるにあたり，多くの方々にご支援いただいた。特に指導教官の広瀬雄二教授からは多くのご指導ご協力をいただき，感謝を申し上げます。また，研究室の皆様にも実験のご協力を頂き，感謝の意を表します。以上を以て，謝辞の言葉とします。
¥begin{thebibliography}{99}
¥bibitem{事例紹介} 日本農業新聞.``「論説」買い物弱者対策移動販売車支援さらに".
¥url{https://www.agrinews.co.jp/opinion/index/180788}, (参照 2024-01-08).
¥bibitem{事例} 経済産業省.``買物弱者支援事業者事例集".
¥url{https://www.meti.go.jp/policy/economy/distribution/houkokusyo.pdf}, (参照 2024-01-08).
¥bibitem{燃料費} NHK.``ガソリン価格最高値更新186.5円/Lに たこ漁や物産展も苦境".
¥url{https://www3.nhk.or.jp/news/html/20230906/k10014185191000.html}, (参照 2024-01-08).
¥bibitem{論文1} 武市伸幸.``高知県中央部における自動車を用いた移動販売と利用者の意識".J-Stage,2000,48-1,p.37-44.
¥bibitem{満足度調査} PRTIMES.``約半数がモバイルオーダーの利用経験あり、2023年4月調査時から10ポイント増加。時短 メリットを感じる人が多い一方で、受け取り時の待ち時間は継続課題。約7割が非対面受け取りのコーヒーサービス利用に意欲".
¥url{https://prtimes.jp/main/html/rd/p/000000060.000046923.html}, (参照 2024-01-08).
¥bibitem{インターネット利用状況} 総務省.``令和4年通信利用動向調査の結果".
¥url{https://www.soumu.go.jp/johotsusintokei/statistics/data/230529_1.pdf}, (参照 2024-01-08).
¥bibitem{シングルタップ} 大塚一徳,宮谷真人.``高齢者のシングルタップ時間に及ぼすワーキングメモリ容量個人差と操作方法の影響".日本教育工学会論文誌,2016,No40,p89.92.
¥bibitem{ハイテク家電} 福田亮子.``高齢者にとってのハクテク家電の問題点".KEIO SFC JOURNAL,2009,No2,p.51-p62.
¥bibitem{業種} AppMaster.``WebSocketとは何か、どのように作成するのか？".
¥url{https://appmaster.io/ja/blog/websockettohahe-ka-donoyounizuo-cheng-surunoka}, (参照 2024-01-08).
¥bibitem{apache} エンベーダー.``人気WebサーバソフトApacheとは?".
¥url{https://envader.plus/article/70}, (参照 2024-01-08).
¥bibitem{sessionStorage} Mmdn web docs.``WindowsessionStorageプロパティ".
¥url{https://developer.mozilla.org/ja/docs/Web/API/Window/sessionStorage}, (参照 2024-01-08).
¥end{thebibliography}
¥end{document}
