バンバンボード・チュートリアル計算編

平野　聡・相川　和希

フォロー

生活や仕事で、やるべきことを管理する、購入する物品を選定する、費用の計画を立てるといった機会は多くある。また、営業の仕事で、お客さんに美しいプレゼンテーションをしながら自動的に見積もりの計算ができたら素晴らしい。

「結婚式の計画」をテーマにして、簡単なタスク管理や、面倒な表計算ソフトが必要だった費用の計算もバンバンボードを使うと式を入力せずに易しく楽しくできることを、ごく簡単なボードを作りながら学んでゆこう。

結婚式全体の計画を作り、シンプルにタスク管理をする。
お料理と招待客の組み合わせを変えて、予算をシミュレーションする。
案内状を例にして見積もり計算をする。

これら3つのボードは、サインイン前に表示されるデモのリストに入っていて、実際に動かしてみることができる。サーバーには保存されず、リロードすれば元に戻るので安心して試してほしい。でも、サインインして自分のボードとして作ってみることをお勧めする。その方がずっと面白い。

では、結婚式全体の計画から始めよう。

結婚式全体の計画を作り、シンプルにタスク管理をする

結婚式の計画をするとして、やるべきこと「タスク」は何があるだろう？会場はどこ？誰を招待する？どんなお料理を出す?

ここでいうタスク管理は、「帰りに牛乳を買う」といったリマインダーとは違い、プロジェクト管理のごくシンプルなものだ。今のところ、期限の入力など複雑な機能は使えない。

図1 結婚のタスク - 「チュートリアル結婚式でやること」のボード

図1は「チュートリアル結婚式でやること」のボードだ。「やること」の行、「やっている」の行、「終わった」の行を作って、「衣装を選ぶ」「招待客を決める」といったタスクをカードとして追加する。

そして、準備の進み具合に応じて、カードを下の行に移していく。

練習問題

「チュートリアル結婚式でやること」のボードを開き、「料理を決める」カードを「やること」行から「やっている」行に動かしてみよう。ヒント: スマートフォンでは、カードを少し強めに押して移動させる。パソコンでは、カードにカーソルを置き、左クリックしたまま次の行に動かす。
ボードにタスクを追加してみよう。他にはどんなタスクがあるだろうか。ヒント: 画面右下の＋ボタンを押して「カード」を選び、新しいカードが開いたらタイトルを入力する。カードに書き込むことができる項目を観察しておこう。
好きなテーマでプロジェクトを計画してみよう。どんなタスクがあり、どういう順番で並べれば良いだろうか？サインインをして新しいボードを作り、タスクを並べてみよう。ヒント: ハッピー君の木製ハウスを作るボードも参考にしよう。

使い方のヒント

カードに他のボードのリンクを入れておけば簡単に移動ができる。全体の計画のボードと、その一部の詳細な計画のボードというように、ボードの親子関係だ。たとえば、「料理を決める」カードにチュートリアル結婚式の計画と予算のリンクを入れておけば、リンクをタップするだけで移動できる。戻るには、右スワイプをするかブラウザーの戻るボタンを押す。リクエストランドの開発が進めば、子供のボードの金額が親のカードに反映するようになるだろう。

ボードにカードが増えてくると、ボードの全体像がわかりにくくなる。カードの大きさは、ボード上のスライダーで調整できる。スマートフォンではボードを2本指でピンチしてもカードの大きさを変えることができる。カードを作るときには大きくして、全体像を見るときには小さくするとよい。ボードの設定でカードの形も選ぶことができる。

ボード内で素早く移動するには、右上の行ジャンプボタンを使う。

料理の予算計画の全体像

次に、料理を決めるタスクを始めよう。これは料理の予算計画だ。

あらかじめ、私たちが作るボードの完成形を見ておこう。図2は「チュートリアル結婚式の計画と予算」のボードだ。

図2 予算計画の完成形 - 「チュートリアル結婚式の計画と予算」のボード

ボードを開いて、カードを動かしてみてほしい。デモなのでリロードをすれば元に戻ってしまう。学習効果を高めるために、サインインをして自分のボードを作りながらやってみることをお勧めする。

この予算計画の目的は、招待客に出すお料理を選ぶこと、招待客を選ぶこと、お料理の金額や招待客の数を増減して料理の予算が自分たちが払える範囲になるようにシミュレーションをすることだ。いろいろな買い物に応用できるだろう。

図2の最初の行は料理の予算で、$110ドル分の料理やドリンクを4人の招待客に出すと、合計で$440ドルになることがわかる。2行目は一人当たりの料理の単価で、料理Aとドリンク、デザートから構成されている。

3行目は料理の選択肢で、A、B、Cの料理から一つを選んでいる。4行目は招待客のリストだ。分かりやすさ優先でタイトルしか書いてないが、実際にバンバンボードを使う時にはお料理やお客さんの写真をつけると楽しいし、計画をする人たちの間で合意を取りやすいだろう。

このようなボードで、料理の種類を変えてみたり、招待客を増やしたり減らしてみると、それに応じて料理の予算が変わる。

練習問題

デザートの$10.00の部分をタップして価格を$8に変えて、料理の予算が変わることを確かめよう。
＋ボタンを押して招待客を増やしてみよう。招待客の数と料理の予算はどのように変わるだろうか？

こういうシミュレーションは表計算ソフトで行うことが多かったが、式を作ることが難しい。特に、料理や招待客の写真をつけて管理するとなると表計算では困難だ。

バンバンボードを使うと、購入する物品の選定、購入価格のシミュレーション、タスクや予算の管理といった作業を、カードの移動だけで簡単に行うことができる。

リクエストランドには使いやすい無料のビデオ・ミーティングもあるので、他の人たちと写真を見ながら組み合わせのシミュレーションができるのも素晴らしい。営業の仕事では、リモートのお客さんと一緒に計算ができるので便利だ。

表計算ソフトと比べて計算機能は限られている。私たちは、表計算のような相対参照やAI、JavaScriptでコードを書ける機能などの開発を進めているので、できることは今後さらに増えていくだろう。

行演算で合計金額を知る

さて、ボード作りを始めよう。ボードのリストで＋ボタンを押して「結婚式の計画と予算」のボードを作る。

図3 料理の種類と料理の単価 - 「チュートリアル結婚式の計画と予算」のボードの初期段階

新しいボードを作ったら、まず図3のように「料理の種類」の行を作り、選択肢となる料理Ａ、料理Ｂ、料理Ｃのカードをそれぞれ追加する。これらは自分で入力してもよいし、ブラウザー上で見つけたどこかのページをボードに入れて自動的に作っても構わない。

「料理単価」の行を作って、招待客１人分の料理の金額を計算をしてみよう。最初に$20のドリンクのカードと$10のデザートのカードを入れておく。行の値は、$20と$10を足した$30になる。このように、価格を含むカードを並べると、計算が自動的に行われる。

ここで、おかしなところに気がついた人もいるだろう。

料理の種類の行に、料理のカードの合計金額が表示されている。料理を全部注文するわけではないから、意味がない金額だ。

これは行のカードから何らかの数値を計算する行演算の結果だ。デフォルトは「自動」で、すべてのカードの値を足し算する「合計」、またはどのカードにも数値がない場合にはカードの枚数を数える「カウント」を行う。カードを並べるだけで合計額を計算できるので、表計算のような面倒な式を入力しなくてもよい。

次に、３つの料理の候補から１つを選んでみよう。例えば、図4のように料理Ａのカードを料理単価の行に移動する。すると、1人分の料理の単価は$110になる。これも行演算の効果だ。

図4 1人分の料理の単価

ただ、この方法だと、料理の種類の行から料理Aのカードが消えるので、料理Aのカードも選択肢であったことがわからなくなってしまう。料理のカードを元の行に戻しておこう。

練習問題

料理単価に入れた料理のカードを、料理の種類にある他の料理のカードと入れ替えて、行演算の効果を見てみよう。

選択行と参照カードでスマートに計算をする

もっと良い方法は、料理の種類の行にあるすべての料理のカードを残したままひとつを選択し、その選択を料理単価に反映させることだ。

まず、先ほど話題にあげた料理の種類の行の合計金額の箇所をタップして、図5のようなリストから「選択」を選ぶ。

図5 行演算を選ぶ

すると、その行の一番左にあるカードの値が選択されて行の値になる。行の値を変えるには、別のカードを左端に持ってくるだけだ。このような、行演算に選択を設定した行を選択行と呼ぶ。

その選択を、料理単価の行に自動的に反映するようにすれば、料理選びはとても簡単になるし、料理のカードが消えてしまうこともない。

それには参照カードを使う。まず、料理単価の行の背景をタップしてボードを編集モードにする。どこでもよい。すると、料理単価の行がフォーカスされる。行の頭に小さな丸いマークがあるのがフォーカスされている行で、新しいカードはこの行に追加される。もう一度行の背景をタップして編集モードを解除しよう。

図6 参照カードで料理の単価を計算する

次に、料理の種類の行にある、「行の参照カード」ボタンを押す。すると、この行への参照カードが作られてフォーカスのある料理単価の行に入る。図6のように料理の単価の行にカードが増えて、料理単価は$110になる。

参照カードにはアイコンがついているので、参照カードであることが一目でわかる。

練習問題

料理の種類の行で、料理Bを一番左に移したり、料理Cを一番左に移したりしてみよう。自動的に参照カードの値も変わり、料理単価の行の値も変わることを確かめよう。つまり、「行の参照カードが行を参照する」とは、参照元のカードで参照先の値を使うことだ。

使い方のヒント

カードが多いときには、一番左を決めるのが難しい。コンパレーターを使うと、ふたつずつ並べて比較することができる。料理の種類の行でコンパレーターボタンを押すと、（タイトルだけで寂しいが）ふたつの料理が表示されるので、一方をスワイプして好きな方を残す。それを繰り返すと、一番気に入った料理が行の一番左のカードになっている。

さて、ここでちょっとした実験をしよう。図7のように、行のタイトルに指やカーソルを当てて動かして(ドラッグして)、料理の種類の行と、料理単価の行の並び順を変えてみてほしい。

図7 行を入れ替える

参照カードは、（参照先の相対的な位置ではなく）参照先そのものを記憶するので、位置が変わっても計算結果は変わらない。ここも表計算と違うところだ。

また、参照されている行の最初に少し空間ができている。このように、参照されている行には「インデント」がついて、参照関係が多少なりともわかるようになっている。参照されている行に含まれる参照カードに参照されている行…のように多段で参照されている行のインデントはその分深くなる。インデントはボードの設定から無効にすることができる。

先に進む前に、料理単価の行を上に、料理の種類の行を下にしておいてほしい。また、料理Ａを一番左に置いてほしい。料理単価の行は$110になっているはずだ。

参照カードと掛け算演算子で合計を得る

一人分のお料理にいくらかけられるかは、招待客全員のお料理の合計金額次第だ。それを求めよう。

図8 - チュートリアル「結婚式の計画と予算」のボード

誰を招待客として招くか考えて人数を決めるために、図8のように招待客の行を追加する。招待したいお客さんのカードを並べてみてほしい。この例では、あなたが有名な映画スターだとして、招待したい映画監督を並べるとしよう。

先ほど述べたように、行のすべてのカードに数値がない場合、行の値はカードの枚数(カウント)になる。ここでは、招待客の数だ。

では、お料理の合計金額「料理の予算」を求めてみよう。参照カードを使えば簡単だ。

一番上に「料理の予算」の行を作る。それには、料理単価の行の＋ボタンを押す。空行ができる。

お料理の合計金額は、一人当たりの料理単価と招待客の人数を掛けたものだ。ふたつの参照カードを作って、掛ければよい。

まず、料理単価の行は$110だった。それを料理の予算の行に持ってくる参照カード作ろう。

料理の予算の行の背景を2回タップして、フォーカスしておく。行の頭の小さな丸いマークがあるのがフォーカスされている行だ。料理単価の行の参照カードボタンを押す。すると、料理の予算の行に料理単価の行への参照カードができる。

同じようにして、招待客の参照カードを作る。料理の予算の行にフォーカスがある状態で、招待客の行の参照カードボタンを押す。

すると、図8のように、料理単価の参照カードと招待客の参照カードが並び、その間に×(かける)のマークが自動的に表示されたはずだ。

このx(かける)を演算子と呼ぶ。これをタップしてみてほしい。ー（引き算）や÷（割り算）のような演算子も選べることがわかる。行のカード間の演算のデフォルトは合計で、その時は＋マークは表示されない。掛け算や割り算は足し算と引き算よりも先に行われる。

料理の予算は$110 x 4で$440になった。

図9 料理を変更すると、参照リンクによって金額が変化する

表計算ソフトのように面倒な式を入力しなくても、参照カードによって料理金額が自動的に計算される。表計算とは違う計算原理のようだが、どういうことだろう？

表計算ではセルを参照する。この例では行を参照した。表計算では行そのものの参照はできない。そういう概念がないからだ。バンバンボードでは、行がカードの内容に応じて自動的に演算をすることで、式の入力を不要にしている。現時点ではカードの参照はできない。開発が進めばいろいろできるようになるだろう。

練習問題

選択する料理を変えたり、招待客を追加して料理の予算がどう変わるかを見てみよう。招待客を減らす時には、その下に「招待客？」という行を作ってそこに動かせば、いつでも元に戻すことができる。
新しいボードを作って、好きなテーマでパーティを計画してみよう。例えば、好きな音楽家・ミュージシャンをたくさん招いて音楽を楽しむパーティーはどうだろう？

複数の行を参照する参照カードで見積もりを作る

招待状の印刷と発送の費用の計算を例にして、複数の商品を組み合わせて買うときの見積もり計算をやってみよう。単価と数量から小計を作り、それに消費税を加えるのだ。

カードを動かして価格や数量を調整して、自分の予算の範囲で納得のゆく購入ができる。営業の仕事をしている人も、お客さんの前でスマートに、美しいプレゼンテーションと同時に見積もりができれば、商談の後で夜中に見積書を作る手間がなくなる。

まず、今までの表計算ソフトでどうやっているかをみてみよう。

図10 見積書を作る: 表計算の場合

表計算では、図10の(a)のように呪文のような計算式を入力すると、(b)の結果が表示される。計算式の作成は難しいし、式に間違いがあっても気が付かないのが難点だ。さらに、この表をお客さんに見せても、イメージが湧かない。金額だけに目が入ってしまう。

図11 見積書を作る: バンバンボード場合 - 「チュートリアル結婚式の案内状の費用」のボード

今度はバンバンボードの番だ。複数の行を参照してその合計値を求めることができれば、このような日常で必要な計算ができるようになる。

図11のように、新しいボードに用紙の行を作る。用紙$6のカードと、数量3のカードを入れる。数量のカードを作るにはボードの右下の＋ボタンを押して「数値カード」を選ぶか、普通のカードを作って編集モードで「数値カード」を選ぶ。自動的に掛け算になる。

印刷費の行を作り、印刷費$28のカードと、数量1のカードを入れる。

配送費の表を作り、配送費$4のカードと、数量1のカードを入れる。

ボードの一番上に合計の行を作り、フォーカスがある状態で、ボードの右下の+(プラス）ボタンを押して、「参照カード」を選ぶ。すると、参照先の行を選択する状態になるので、用紙の行と印刷費の行と配送費の行にチェックマークをつける。そして、画面右上の完了ボタンを押す。

図12 複数の参照先を選択する

すると、「用紙印刷費配送費」という参照カードができて、各行の金額の合計$50が表示されるはずだ。カードを開いてタイトルを「小計」にしておこう。

小計が出たので、消費税を加えて合計額を出してみよう。簡単には、税率をかければよい。数値のカードを作って1.1を入れる。それで、合計額が$55になったはずだ。

別のやり方として、小計のカードをコピーして、数値0.1のカードをかけてもよい。小計のカードと足されて、$55の合計額が出る。

これで、図10の表計算とほぼ同じ計算ができた。

図12のように参照カードの参照ボタンを押せば、いつでも参照先を確認したり変更することができる。

練習問題

「用紙の種類」の行を作って美しい写真付きのカードを複数並べ、選択したカードを用紙のカードから参照するように変えてみよう。ヒント: 前章で学んだ料理の種類と料理単価の関係と同じだ。
120円のりんご3個、80円のみかん5個、50円のバナナ4本の合計を計算するボードを作ってみよう。ヒント: りんごの行、みかんの行、バナナの行、合計の行を作り、合計の行にりんごの行、みかんの行、バナナの行を参照する参照カードを入れる。
120円のりんご3個、80円のみかん5個、50円のバナナ4本の合計を計算する、別のやり方を2つ考えてボードを作ってみよう。ヒント1: カードの中の「価格」には式を書くことができるので、カード1枚で合計の計算ができる。ヒント2: 1行に全てのカードを並べ、行演算で合計を知る方法もある。
「チュートリアル結婚式でやること」のボードの、「案内状を送る」のカードを編集して、今作った「チュートリアル結婚式の案内状の費用」のボードのリンクを入れよう。カードの下部をタップするだけでジャンプするだろうか？ヒント: デモのページは保存されないため、サインイン後の自分のボード同士を結びつけること。リンクはブラウザーのアドレスバーか、ユーザーメニューの「ページを共有する、QRコードを開く」から「このページを共有」で得ることができる。
「チュートリアル結婚式でやること」のボードで全体の予算がわかるといい。（今はボード間の値の参照はできないので）それぞれのカードに仮の予算を入れておき、上で学んだ複数の行を参照する方法を使って全体の合計値を出してみよう。ヒント: 最上位に行を追加し、各行の合計を表す参照カードを入れる。
前の問題で、予算と実際にかかった金額の両方がわかるといい。どうしたらいいだろうか？

結婚する二人へ

これで、結婚式の計画のチュートリアルは終わりだ。結婚式を無事に挙げたら、長い結婚生活が待っている。

結婚とは、鏡のようなものだ。

30年の間、たくさんの喧嘩をして、そう学んだ。自分の至らなさが、相手を通して鏡のように返ってくる。自分の良さも返ってくる。思いやりと忍耐だけが永い結婚生活を支える。

二人の幸せな人生を心から祈っている。