Viscuitアプリ(Viscuit beta)初歩の初歩

Viscuit betaを就学前の子どもに試してみようと考えています。
しかし、Viscuitのワークショップは関東での開催が多く、地方ではなかなか参加の機会がありません。
そこでViscuit betaを自分で使ってみようとしたのですが、いろいろハマりましたので、そのポイントをまとめます。
私自身はViscuitのブラウザ版を以前に触ったことがあるのですが、アプリ版は使い勝手が異なり少し苦労しました。
これから使ってみようという方の参考になれば幸いです。


# Viscuitとは？

> 2003年にNTTの研究で開発された「誰でもプログラミングを体験してコンピュータの本質が理解できる」をコンセプトとしたビジュアルプログラミング言語です。

> ビスケットはプログラミングの入門言語ではなく、「コンピュータってこういうものなんだ」と直感的に知ってもらうためのものです。

「こどもビスケット開発室」
http://www.digitalpocket.org/viscuit/


# まずはブラウザ版を！

![top.png](https://qiita-image-store.s3.amazonaws.com/0/109394/70eb66c6-b9e5-de70-7b94-8c4db46466d0.png)

http://www.viscuit.com/

Viscuitのトップページにはチュートリアルの動画が豊富に用意されています。
しかし、動画はアプリ版ではなくブラウザ版での利用を前提としており、既にViscuitで新規作成ができる状態からのスタートになっています。


Viscuitをこれから子どもに使わせるために、まず自分で試してみよう！
という場合は、いきなりアプリをダウンロードするより、まずはブラウザ版でいろいろ試してから、後述の「ビスケット開発室」ブログを参考に、アプリに進まれる方がおすすめです。


# Viscuitアプリ（Viscit beta）のダウンロード

http://develop.viscuit.com/viscuitrelease/

iPhone・iPad、Android、Windows、Mac、Kindle Fireに対応しています。

スマートフォンで使えるのは嬉しいですね。
子どもと一緒に楽しむために、親がすきま時間にさっと使ってみる、ということがしやすいです。
私は、Windows 7、Windows 10、Kindle Fire、Androidにインストールして使っています。


# Viscuit Betaの起動

全画面表示で起動されますが、ESCキーで解除できます。

![top2.jpg](https://qiita-image-store.s3.amazonaws.com/0/109394/78194a6e-1a0b-74ef-5d51-6063b4320ff4.jpeg)

このように魚のアイコンが表示されればOKです。

### 注意……オフラインでは利用できない！

オフライン環境で起動した場合、魚のアイコンが表示されず、先に進めませんのでご注意ください。


# Viscuit betaの使い方
「Viscuit開発室」ブログを参考にすすめていきます。

「Viscuit開発室」
http://devroom.viscuit.com/

「ビスケットの遊び方１」
http://goo.gl/P1LWu1



# 同じ数字のアイコンがない！
「ビスケットの遊び方１」には、

![wakaba.png](https://qiita-image-store.s3.amazonaws.com/0/109394/74cb6c87-293b-701b-e161-fc0e0d7c5374.png)


とあります。
しかし、実際には若葉マークのアイコンはありますが、「0030」という同じ数字のものはありません。

![0211.jpg](https://qiita-image-store.s3.amazonaws.com/0/109394/2ccc3cef-990a-5c8f-cece-888eddaa2baf.jpeg)


よく読むと、

> ここで．アイコンの下にでている数字はランドの回数の数字です．魚は００５７なので５７回目のランドということになります．

とあります。つまり、アイコンの下にある数字は可変なのです。
このQiitaを作成した2016/08/31時点では、「0211」になります。

また、

> 一つのランドは１６人くらいの作品が保存されると，新しいのに自動的に切り替わるようになっています．チェックは１０分刻みなので，一気に大量に作るともっと多く作れるかもしれません．
(中略)

とあります。「0030」はこのブログが投稿された2016/5/22時点のものというわけです。

さらに、

![0006.jpg](https://qiita-image-store.s3.amazonaws.com/0/109394/1d655d95-95f1-6e01-3cc5-b5f45d6a2e98.jpeg)


とありますが、こちらも「0006」は5月22日時点の数字です。
これを書いている2016/8/31時点は「0151」です。

![151-2.jpg](https://qiita-image-store.s3.amazonaws.com/0/109394/25710bcc-3f8a-90ff-6a83-94c040a77bc9.jpeg)
えんぴつのアイコンが新規作成、右にあるシャワーヘッドのようなアイコンが、同じ「151」に投稿された他の作品をみるためのものです。

## 新規作成画面

![151-3.jpg](https://qiita-image-store.s3.amazonaws.com/0/109394/e0ffaca8-d908-87e4-e871-9ba7d46c8dea.jpeg)

基本的な使い方は、
「ビスケットの遊び方２（タッチ編）」にあります。
 http://goo.gl/Cu1npf

作品を保存するときは、右上の□に↑が重なったボタンを使います。
2016/8/31時点では、「0151」に保存されます。

## 絵を傾ける・回転させる

「ビスケットの遊び方２（タッチ編）」に、回転の方法も紹介されています。
http://goo.gl/Cu1npf

これが、アプリ版の回転のオン・オフを切り替えるボタンです。
![回転_アプリ.png](https://qiita-image-store.s3.amazonaws.com/0/109394/922ac74e-7544-0daf-274d-3573b58c1cf1.png)

ブログには、
> ２本指で操作するのですが，一般的な回転とはちょっと振る舞いがちがいます．まず一本の指でドラッグしますが，回転モードのときは，もう一本の指をその絵の周りでなぞると，絵を回転させることができます．

とあります。
私は右利きなので、左手のひとさし指を軸に、扇を開くようなイメージで右手の人差し指を動かしています。
人の絵のの場合は頭の部分を軸に、足先よりも外側に右手の人さし指をおいて大きく動かします。
頭を太陽系として、その周りを地球がぐるぐる回るようなイメージで回転させます。
![回転.png](https://qiita-image-store.s3.amazonaws.com/0/109394/2b6611d3-0203-44f0-5780-2198a5afe9ef.png)

タッチパネル非対応のデスクトップ版アプリでは回転できないかも……？


## ブラウザ版での回転方法

1.「e」の形をした矢印のアイコンをクリックします。
（アプリ版の回転ボタンとは形が異なります）
![回転1.png](https://qiita-image-store.s3.amazonaws.com/0/109394/6b8b9389-452f-5020-5363-e2e7bbc35454.png)

2.部品にうっすら電源ボタンのようなマークが現れるので、その状態で絵の端をマウスでドラッグすれば回転します。
![回転2.png](https://qiita-image-store.s3.amazonaws.com/0/109394/ed2d2601-4e59-0e67-355b-7a76c83882a9.png)


# 一度描いた絵を再編集する

部品置き場（鉛筆などのボタンがある場所）の絵を長押しすると再編集できます。
5秒位長押してください！　部品置き場以外の絵を長押ししても何も起こりません。
![再編集.png](https://qiita-image-store.s3.amazonaws.com/0/109394/e4c74ffc-70fa-263d-a8f7-7b3539362336.png)

## ブラウザ版での再編集方法

ブラウザ版では、画面の右側に「自分の描いた絵＋鉛筆」の小さいアイコンが表示されますので、そこをクリックすると再編集できます。ブラウザ版で部品置き場の絵を長押ししても、何も起こりません。
![再編集2.png](https://qiita-image-store.s3.amazonaws.com/0/109394/cf97bf89-f9a0-9649-02f8-04fe4a9435ef.png)


# 自分の過去の作品を見たい

前回投稿したときよりも時間が経って、アイコンの数字が上がってしまった場合は、

![cs.png](https://qiita-image-store.s3.amazonaws.com/0/109394/ceb2149d-e186-8992-4e25-bd460244c260.png)をクリックします。

![cs2.jpg](https://qiita-image-store.s3.amazonaws.com/0/109394/f2ae009e-1bf5-1fa2-132a-6b44a081691d.jpeg)

このように、たくさんの数字のついたノートパソコンのアイコンが表示されます。

説明には、

> 後で自分の作品を見直したいときには，この数字が必要です．

とあります。

例えば、私は2016/8/30にScratchで簡単な作品を作ったのですが、そのときの番号は「148」でした。
そこで、148のアイコンを探して選択すると、自分が8/30につくったものをみつけることができました。


なお、ブラウザ版の作品の保存方法はこちらに紹介されています。
https://youtu.be/o2OXeElIk8c


# おわりに

まだまだ私自身、Viscuit betaでわからないところは沢山あります。
しかし、せっかく面白いアプリなのに、起動の部分でつまずいてしまってはもったいないと思い、投稿させていただきました。
少しずつ試していき、わかったことがあれば、こちらに追記していきます。