あんどの投稿 - Crieit

個人開発のUI設計術

2018-12-26T08:26:53+09:00

あんど( @ampersand_xyz )と申します。
クイズメーカーなど、色々なサービスを個人でリリースしているフリーのエンジニアです。
個人開発を支える技術のアドベントカレンダーではサービスを構築するArchitectureに関する技術の話題が多いなか、周りの方やマシュマロからの匿名メッセージ質問でUIのことに関する質問などが多かったので、本投稿ではUIやデザイン周りに関するTechnic…と言えるほど上等なものではないのですが、そのあたりの技術をお話したいと思います。
なお、自分は正直かなり我流で適当にやっているので、もっといい方法のツッコミなど歓迎しております。

1.画面サイズの最大・最小幅を最初に決めておく

まずはじめにここを決めます。
いかにリキッドデザインやレスポンシブで画面を作成するといえども、極端に幅が小さい、または大きいデバイスを相手にする場合、どうしてもサイズ整合性を保つことが難しくなります。
これの対抗策として、コンテンツの最大幅・最小幅を最初に決めてしまいます。
基準としては、最小は未だに人気の高いiPhoneSEの解像度である320px、最大幅はPCもそんなにデカいディスプレイを使ってる人ばかりではないので1024px程度で良いかと思います。

2.制作物のコンセプトを決める

これも早い段階で決めます。
このあたりが決まらないといつまでも色をどうするとか、フォントをどうするとか迷い続けることになります。
具体的に決める内容としては「このプロダクトは優しい印象をもって欲しいから丸字のフォントを使う」とか「真面目な印象を与えたいのでクール系の色にまとめる」とかそういう感じです。

「アジャイルだからやってみてから決める」とか「デザインしながらコーディングするからそれは後回しでいい」とか、そういうセリフはその手法でどうにかなるレベルの規模の開発か、それでどうにかなる達人のセリフです。おいそれと真似できるものではありません。
時間と労力を無駄にしないために物事を進める上で決めなきゃいけないことは先に決めましょう。
現実として、それでも戻らなくてはいけない時、というのは得てして起こり得るものですが、その時のダメージも決めることを決めた上で戻るのか、そうでないかでダメージはずいぶん違うものです。

3.採用する色を決める

コンセプトに合わせた色を決める

この段階でカラーコードを厳密に決める必要はありません。それこそ後で調整をしながらしっくり来る色を探せば済みます。
ここでは、メインに据える色、サブとして使用する色をなんとなく決めていきます。
決めるための基準として2.で決めたコンセプトを拠り所とします。
コンセプトに見合う色を色彩心理学に基づいて決めるのが短絡的な近道ですが、テーマやモチーフ等がある場合はそれに沿うこともベターな選択肢であると思います。
色彩心理学の説明はこちらのページの「それぞれの色彩が与える印象を活用して配色できているか？」の項目が参考になります。
https://liskul.com/wm_cpsychology-4111

ユニバーサルな色であるか確認する＋α

wikipediaからの抜粋情報ですが、先天性色覚異常を持つ人は、日本においては男性で約5%、女性で約0.2%の割合であるが、フランスや北欧では男性で約10%、女性で約0.5%であり、アフリカ系の人では2～4%程度であり、日本全体だけでも日本全体では約290万人が存在するとされています。
思っているよりもずっと色覚が自分と異なっている人は多いということ、また、自動車免許を取得される場合は気づくかもしれませんが、自身が色覚異常であると気づいていないケースもありえます。
大事なのは異常が云々ではなく、自分が見えてるものが相手にも同じに見えているとは限らないということを念頭に置く必要があるということです。
では、何を考えなくてはいけないかというと、より多くの人が判別しやすい色使いでUIを作成するということです。
ここでいうUIとは、あしらいや彩りのことではなく、「見えていなくては困る情報」を指します。
具体的な例を示します。

これは極端に見づらい色をチョイスしていますが、色覚異常がある場合はそもそも文字があることを認識できない、という問題になります。
背景色を敷いている場合は、文字情報はコントラストをつけるようにすると解決します。

また、色だけで区分が明確にならない場合が存在します。
例えば赤と緑は色覚異常がある場合判別しづらいことがあります。そういった場合に備え、アイコンや文字表現などを用いてより明確化を図ります。

4.CSSフレームワークとの付き合い方を決める

BootstarapやBulma、OnsenUIなど色々ありますが、CSSフレームワークを採用する場合、はじめからあまり改造を必要としないUIを作るように画面設計するのが無難です。

自分のサービス独自の仕様となるような込み入ったUIを作る場合は、CSSフレームワークを魔改造するより自前でゼロから作ってしまうほうが綺麗で応用が効くものが作れると経験上思っています。
CSSフレームワークを手放せない、という方も一度フルスクラッチで作ってみることをオススメしたいです。
多分なれればゼロから自分で作るほうが早いはず（と、自分は思っていますがUIフルスクラッチゴリラの暴論かもしれません。ご自身に合った方法を選んでください）。

5-1.画面設計をする

ツールは何でも良いのですが、画面設計をします。自分の場合はAdobe XDを使っています。
この工程は「自分が作ろうとしてるものを自分でより具体的に認識する」ためのものです。
ある程度この段階で「これ思ってたより作るのがめんどくさそう」と判断出来たり「これ要らなくね？」というのが見えてきます。
実装してから、要らなかったかもな、と気づいても開発にかけたサンクコストによって切り捨てづらくなったりします。
また、自分の場合は一人でやっているのでそこまで問題にはなりませんが、共同開発をしていてパートナーに作ってもらった機能だったりすると、捨てづらさはもっと大きなものになるでしょう。
望まない悲しみを避けるためにも、判断は最低限のダメージですむうちに行うのが基本です。

また、ワイヤーフレームの作成と、ビジュアルデザインUIの作成はまったく別の工程の作業になるので、混同しないようにしましょう。

余談ですがこれはクイズメーカーを作成していた時、時期にして2018年7月末頃に作っていたワイヤーフレームの一部です。
色々名残は残っているのですが、結構紆余曲折しました。

1個あたりのサイズが小さかったり項目追加に対する強さが微妙なのでボツに。

なんか色周りについて締まりがなくてだいぶ迷走していました。

5-2.出来るだけ1カラムのUIにする

一般向けのウェブサイトにおけるモバイルからの閲覧が8割以上を占める昨今において、広いデバイス側にあわせてUIを構築するのは誰にとっても旨味があんまりありません。
あわせ、開発に無駄なコストがかかりがちです。
言葉だけで説明するのは難しいので図解するとこういうことです

一見なんとなくありがちな感じのこういうフォームですが

何も考えないで画面サイズで縮小するとこういう感じになる未来が待ってます。悲しいですね。

では入力項目を縦に並べるのはどうでしょう。

マシになったように見えます。しかし項目名に「メールアドレス」より長い要素が来た場合はどうなるでしょうか？そういう部分にも思いを馳せて設計していく必要があります。
また、「メールアドレス」みたいな長い項目名はこういう事になりがちです。

悲しいですね。

余計な例が多くなりましたが、1カラムでUIを設計することでこの辺の問題は結構解決します。

スッキリしましたね。
横幅の可変対応にも強く、項目名称の文字数にも余裕を取ることができました。
また、項目ごとのまとまりも分かりやすくなったかと思います。
バリデーションメッセージなどを表示させる場合も、縦に伸ばしてやる方向で対応することが出来るため、UI周りが見た目もマークアップもごちゃつかずにスッキリさせることができます。

チェックボックスやラジオボタンを添える場合などでマルチカラムのUIを用いる場合は、1行に可変長の列を1つ以上持たないようにするという形で秩序を保つことができるかと思います。

5-3.可変長の項目が問題ない配置になっているか確認する

ユーザーが入力して設定するもの（例えばユーザ名や投稿するコンテンツの内容など）が、レイアウト的に問題ないか確認しておきます。
配置的にどうしようもない場合は、N文字以上は「...」にするなどの対策を検討します。

5-4.「見えない線」を揃える

人間は無意識に「見えない線」を引いて色々なものを区別しています。
例えば5-1で出したこの入力項目を例にします

これを、見えない線を崩してやるとどうなるでしょうか

このようになります。項目は同じなのにすごく気持ち悪く、なんだかイケてなさを感じないですか？

見えない線を可視化するとこんなかんじになります。

この線のリズムがずれる時、人間は違和感を感じ、それを洗練されてなさとして認識します。
この例はかなりミニマム単位を取り上げていますが、範囲が大きくなっても同じ考えを適用できます。
逆に、強調したい要素はあえてこの線のリズムを外してやることで目線を引っ張ることもできます。
ていうかこの辺揃ってないと実装のときも辛いです。
また、余白のスペースのとり方については2の累乗数を用いるとしっくり来ます。
その理由については、こちらのブログ記事を御覧ください。ちょっと昔の記事ですが、エンジニアにも分かりやすく、最新でもバリバリ使えるデザイン・UIに関するプリミティブな知見情報ですのでご一読を強く推奨します。
https://ameblo.jp/ca-1pixel/entry-11837685575.html

5-5.トーンを整える

アイコンフォントやフリーイラストを使う場合は「複数のところから使うものをもってくると統一感（トーン）がバラバラになってダサく見える問題」が起こります。
自分はそれが嫌で絵やアイコンを自分で描くようになりましたが、基本「混ぜて使うことを避ける」だけで十分かと思います。

6.文言を考える

説明文やボタンに表示する文言を考えます。
自分が決める上で重要としているポイントとしては 「分かりづらいスタイリッシュより分かりやすいダサいのほうがずっと良い」 ということです。
伝わらなければゼロですが、たとえ伝えたいことの3割しか伝わってなかったとしても、ゼロとは圧倒的な差です。
楽にこの辺を実践する方法としては「アクションが何をするのか説明する」です。あと、多少文章になっても構わんという気持ちをセットで持ちます。

具体的ではない例。フォームだけでは何をしているシーンなのかは断定しきれません。

具体的にした例。どういう機能を使っているのかを判別できるので操作をしているときに何をしているのかを見失わず、確認をするための判別コスト＝ユーザのストレスになる要因を軽減できます。

7.アニメーションをどうするかまずは脳内で考える

アニメーションは大きく分けて「演出」と「操作支援」として考えています。
演出とは、例えばランディングページの装飾として使うような派手なものや、要素をフローティングさせたりするなどです。
操作支援は例えばスムーススクロールであったり、ブラウザのスワイプ時のページ送りなどにみられる、ユーザーの画面操作のトリガーとその結果を見えるようにつなぐアニメーションです。
例えば画面内リンクはクリックした瞬間（画面操作のトリガー）に、画面内の遠くの要素に突然飛んでしまうと「いまどこに来た？」となるので、スクロールをアニメーションして移動地点（操作の結果）をつないでやる、という意味合いになります。

アニメーションは使い方が難しい要素です。
人間は「動いているものを意識してしまう」ものです。要素にパルスやフローティングなどのアニメーション演出を加えると、効果的に視線を集める事ができます。
反面、「意味なく動いているものがずっと視界に入りつづける」ことはストレスになるので避けるべきかもしれません。
また、アニメーションがもたもたして操作が妨げられることもストレスになります。
例えばメニューボタンを押したのに3秒ぐらいモサモサしてるとか演出が入って操作できないとかイライラしますよね。
ものによっては「ほんとにアニメーションさせて表示する必要があるのか？」などを考えます。
余談として個人的な感覚ですが表示／非表示切り替え系だと、フェードなら表示0.3秒、非表示0.2秒、トグルなら表示0.5秒、非表示0.3秒、ぐらいでなんとなく収まりがいい感じになる気がします。

8.ロゴなどを作る

ここはメチャメチャ難しいです。後回しにしても構わないと思います。
もしあなたが作るサービスをビジネスとして本気でスケールさせるような場合はロゴデザインを信用できる先に依頼するのが良いかと思いますが、
まず趣味のレベルでやる場合は、かっこいいフォントのパワーに任せるのが安全パイです。
無料フォントでもイケててカッコいいものはたくさんあります。特に英字フォントはかなりバリエーション豊かなので、大抵の要望に叶うものは見つかると思われます。
ロゴに日本語フォントを使う場合は「ためしがき」を使うと手軽に比較でき、かつライセンス的にもクリアなものが一覧化されています。
また、有料フォントはたまに95％オフとか「収益どうなってんの？」みたいなセールが開催されることがあります。そういうときにはぜひ買っておきましょう。イケてるフォントは強力な武器になってロゴ作成のみならず様々な場面でデザインを支えてくれます。

9.あとは気合で実装する

ハァーッ！！！！！！！！！！！！！！！！！！！！

以上のことを全部守ると実装の都合を考えすぎたつまらんUIが出来上がります

実装を知るがゆえに負担の少ない道を選びがちになる傾向があります…。
作成するサービスそれぞれの独自性や遊び心や工夫を忘れないようにして頂ければ幸いです。

追記：つまらないUIというのは良い意味でも悪い意味でもあります。
つまらないと感じるほど見慣れた、慣れ親しんだものは言いかればアフォーダンスへの則りがよく行われており、人を迷わせることがないUIであると言えます。
プロフィールや設定系のフォームなどは、つまらない＝平易で分かりやすいUIであるほうが望ましいとも言えます。

では、つまらなくないUIとはなにか、といえば「使った時に気持ちがいい」ようなものかな…と思っています。
それを多分言葉で表すと「マイクロインタラクション」というものになると思うんですが、それをどのように実現するかはサービス独自のコンセプトやデザインによって遊び心を加えるような部分になると思っています。
例えばnoteなどのブログサービスにある入力して保存するとピュッと上の方に細いバーが走って保存した、ということを体感として表すようなものとか、操作に対してリアクションをしてくれるようなものですね。

これは余談なのですが、マイクロと呼ぶにはちょっと大きいインタラクションもアリかと思っていまして、手前味噌でおこがましいのですが、 meeemo というメモアプリを作ったさいに削除の動きにちょっと遊びをいれたのが意外と好評で嬉しかったところでした。ただ、全部の操作やUIをこんな感じに演出過剰にしてしまうと胃もたれが起こりますので、留意が必要です。

https://t.co/I2kTWeP424 こだわったポイント pic.twitter.com/eYrhI8JbQ5
— あんど＠クイズをよろしく頼むよ (@ampersand_xyz) 2018年6月14日

結びに

書いていて「何様なんだ…」と自分自身に何度もツッコミをしてしまいました、我ながらおこがましい…。
冒頭でも書きましたが、独学とオレオレ思想でやっているので「もっとこうしたら良いよ」というご意見があれば頂戴したい次第となりますので、ぜひツッコミいただければと思います。

それでは、語りきれなかったこともありますが、ここで筆を置かせていただこうかと思います。

アドベントカレンダーの投稿が遅れてしまい申し訳ありませんでしたm(_ _)m💦

趣味の個人開発とマネタイズやモチベーションのこと

2018-12-04T00:14:45+09:00

これはCrieitアドベントカレンダー 4日目の記事、あんどがお届けします。
クソアプリ友達ということで全日に地獄からご紹介に預かりましたとおり、
個人的な趣味でサービスをいくつか出したり運営しているのですが、それに伴った話を書かせて頂きます。プレッシャーが凄い。

今まで個人開発で上げた収益

0円です。
今までいくつかのサービスを出してきていますが、アドセンスや課金など、直接的な収益としてお金は稼いでいません。
………ということを話すと驚かれることがあったり、別の方の個人開発の記事などを見ていてもマネタイズの話などがよくでてくることや、周りの人々と話していてもどうやら自分が微妙に変わり者らしいということに気づいたのでこの話題を選びました。
じゃあマネタイズとかってタイトルにつけるなよって思うかもしれませんが、一応後半でその話もちゃんと出ます。

趣味でお金を稼ぐということ

昨今、ハンドメイドのアクセサリーやフィギュアの販売ができるようなプラットフォームが沢山増えてきており、色々と「個人の趣味が収益化する」という動きが目立つようになった時勢であるなーと思います。
また、ウェブサービスやアプリなどは、課金をしてもらうための導線設計がしやすいという部分もあり「個人アプリ・サービス＝広告や課金アイテム、有料プランでマネタイズ」というイメージになりやすい部分もあると思いますし、ある程度それが「当たり前」っぽいということも分かっています。
ただ、自分が趣味で個人開発するモチベーションや目的の中に「作ったもので直接お金を稼ぐ」ことが含まれていないというだけです。

お金が欲しくないわけではない

5000兆円欲しいというフレーズを口癖にしている程度にはお金欲しいとは思っているんですけどもね。もちろん、サービスが高額で売れるというようなアメリカンドリームを夢見ないわけではありません。だって人間だもの。

では自分の場合、何をモチベーションとして個人開発をしているのか

ひとえに自分が作ったものはウケるのか？ということを確かめたい、という想いで作っています。ウケる、とはどういうことかといえば

自分の考えたものがSNSなどで話題になるポテンシャルがあるのか？
自分の考えたUIやUXは狙ったとおりの結果を得られるのか？
自分の技術でやりたいことは実現できるのか？

などということを指しています。
自分の実力は世間に通じるのか？という武者修行や腕試しというものが近いのかもしれません。

ひとりで全てをやるということについて

自分は設計・開発・デザイン・イラストレーションを全部ひとりでやっています。ただ、デザインやイラストは専門分野としているものではないのでその品質はプロには遠く及びません。非常に恥ずかしながらミドルウェア構築などについてもそうであります。
餅は餅屋という言葉があるように、専門分野は専門スキルをもった人に任せたり得意分野を分担しながらチームを組むほうが圧倒的に合理的だとは思いますし、誰かと一緒に開発するというのは非常にハートフルであることは知っています。
ただ、自分は仕事としてそれはやっているのです。
趣味の分野にそれを持ち込みたくないという想いが強いですし、個人開発だからこそ、誰にも、何も気兼ねしたくなく、名作「プラネテス」の主人公・ハチマキのセリフをもじって借りて言うならば、喜びも、悲しみも、辛さも、怒りも勿体なくて誰かに渡したくはないのです。

ほぼ単なる意固地でこういう姿勢を貫いて今に至っていますが、非常に得られるものは大きくもありました。

単純にちょっと自信がついた

「こういうことをやっているよ」と言えるものがあるだけで、その事実が単純に自分を支えてくれるというか、ちょっとしたことで揺らがなくなりました。
自分が信じるもの（技術や思想）を実績や経験をもって話すことが出来るというのは大きいです。無論、成功経験だけにとらわれて他の物を取り入れるような発展を放棄しては良くないのですが、何かを成し遂げる方法として一つ渡りきった橋というか道を知っているというのは大事なことで、例えば「これを実装しようと思うんだけど、このライブラリが
流行っててなんかみんな使ってるから使おうと思います
」というのと「
使ってみた実績としてこの規模であれば問題なく
起用できます」って、提案聞く側としても安心感が違いますよね。
自信という目に見えない定性的なものではありますが、完全に自分が強くなっていく感覚が得られるので楽しいです。筋トレみたいなもんですね。

得られたものもう一つ、他の業務の大変さが分かるようになった

自分で色々とやってみることで他業種（自分にとっては、本業はエンジニアなので、デザイナーさん、イラストレータさん、ディレクターさんなどを指します）の大変さや、都合などの想像がつくようになりました。
これは非常に仕事に役に立っており、「何をどう調整してほしいのかをある程度具体的に言えるようになった」とか「どのぐらいの作業工数が掛かりそうかの見積もり」など、ある程度全体の作業やリスクを見通すことが見通せるスキルという形として手に入れられたものになります。（逆に「この成果物全然気合入ってねーな」というのも何となく分かるようになったのですが…この話は置いときます）
他の人の作業に想像が至ることで、業務をやっていく際に優しさをもってやっていけるスキルを手に入れられたんじゃないかなと思っています。

スキルに伴う実績としての個人サービス

スキルや自信を手に入れられた、とは言っても自分がそう思い込んでいるだけだとすればそれはちょっとマズイという話です。
故に、自分がやれることの内容や範囲を客観的に評価してもらうためのものとしての個人サービスの公開や運営をしています。

直接収益を上げることだけがマネタイズではない

ここで掲題の件に戻ります。
話の順番が前後したというか、自己紹介も御座なりになっていましたが、自分はフリーランサー稼業をしており、その業務内容は「Web開発に関わる何でも屋」みたいな感じです。
お仕事としては「０→１」のお仕事の手伝いをさせていただくことが割と多く、自分も割とそういうことを好んでいますが、それにはある程度ジェネラリストとしてのスキルが求められるところになります。
そして、こういうサービス制作活動をしているとそういった案件のお声がけを頂けることもちょくちょくあります。
つまり、自分がやりたい仕事ができる…自分の実力を信用していただけたりであったり、自分の活動でもって声をかけて頂ける、ということですね。
ちなみに、お仕事につながることについては直接のモチベーションというか、趣味が功を奏した結果という感じですので前項ではモチベーションの要素として語っていません。

まとめ

自分の結果だけ見ると、「個人サービス開発を通して間接的な収益を上げること」には成功しているといえます。
あと、色々周囲の個人エンジニアに聞いた事例としては特段大ヒットしてるサービスとかではなくても、思想やフィーリングが合うとか、あるいは要件にぴたっとマッチしてるとか、そういう話でお仕事につながっていたりするということも耳にします。
自分は大ヒットと言えるほどのサービスはまだ生み出せていませんが、間接マネタイズは出来てるなーと言えると思うので、もしこの記事タイトルを見て「収益化どうしたらええんや」っていう思いで読んでくださった方にはこういう道もあるよ、ということでお伝えできればと思います。
え？会社員だからそういうのは出来ないんだけど？とか言う方もいらっしゃるかもしれませんが、社内で仕事進めるのにも多角的な視点を持ってると強いマンとしてやっていけると思いますよ。
あと、これまで約2,800字を費やして話した内容については「インバウンドマーケティング」っていう一言で済むらしいですよ。へぇ〜〜〜！！

まあ、もう単純になんか作ったら作った数だけ強くなるし、誰かしらが褒めてくれるし、なんかお仕事になる話も来るので、とりあえず難しいこと考えずにものづくりしたら良いです。そういう話です。脳筋サイコー！！！

それではこのへんで筆を置かせて頂きます。
明日のアドベントカレンダーもたのしみですね！morixさんよろしくおねがいします！

おまけ

自分が作ったサービスの紹介
chrome.google.com
meeemo.space
ritwee.top
hyou.show
quiz-maker.site

今年つくったサービス・アプリを振り返る

2018-11-07T08:59:02+09:00

2018年もすでに11月となり、いよいよ冬の気配が深まってきました。
今年はボチボチ沢山サービスを作ったので、アドベントカレンダーに挑む前にちょっと振り返ってみようと思いまして、はじめてのCrieitの記事を書いています。
以下のサービスを、すべて一人で開発しています。

webpage Capture and Paint

https://chrome.google.com/webstore/detail/webpage-capture-and-paint/mdglibpddhkadiadabckagelmmomoobn

1/17にリリース。
ボタンポチーですぐスクショを撮れる＋撮ったスクショにお絵かきができるChrome拡張です。
表示範囲のみ、フルスクリーン、選択範囲のみの形のキャプチャ範囲に対応しています。
グラフィックツールを持ってない人や、いちいち画像に文字を入れるためにソフトを起動するのが面倒だぜ！！！と思い作りました。自分でも未だに結構愛用しています。
Chrome拡張はサーバ借りたりしなくていいんで気楽にやれて良さがあります。

Chrome拡張を作成して公開しました！https://t.co/qUmpWePpDW画面をキャプチャしたらそのまま線や文字の書き込みをしてすぐ保存できます。表示範囲／範囲選択／自動スクロールによる全画面キャプチャに対応しています。オフラインでも使えるよ！！ pic.twitter.com/fAF6XeVdLc
— あんど＠クイズメーカーとか作ってるよ (@ampersand_xyz) 2018年1月17日

かわりに言って！代理ちゃん！！

2/2にリリース。
完全に匿名でツイートを行えるサービスで、専用のアカウントからウェブページを通してツイートができるというサービスでした。ただ、匿名で殺害予告とかされてしまうと非常に良くないので、ログインは必須とし、NGワードを設定して「つぶやきできないワードが入っています」などの過激な内容の投稿は踏みとどまることができる仕様になっていました。
過去形で表現しているのは、うっかり間違ってサービスをデプロイしているサーバを初期化してしまったからです。しかも適当に作ったものだったので管理が雑で、致命的なファイルをそこで喪失してしまったため未だサービス停止中です。ほんと仕事でこういうことをやらかさなくてよかったとしか思えません。良い自戒になりました。

変なサービスを作りました。増田ダイアリーみたいなノリで使ってもらえればいいなって思います。ーーかわりに言って！代理ちゃん！！ | 言いづらいことを代わりに言ってくれるツイート代行サービス https://t.co/fkpnnt5zl7
— あんど＠クイズメーカーとか作ってるよ (@ampersand_xyz) 2018年2月2日

なお、代理でつぶやきをしていたアカウントは未だに残っている( https://twitter.com/dairi_you )のですが、愚痴っぽいものもありつつ、たまーに給湯室で横恋慕してる思いがつぶやかれてたり、優しさが溢れる感じの内容があったり、サービスにはパラリパラリと人が来る程度で大人気という感じではなかったのですが意外とコアなファンがついた趣深いサービスでした、いつか形は変わるかもしれないけど再開したい。

meeemo

https://meeemo.space

6/15にリリース。
付箋を使ったブレインストーミングをオンラインでもやれるようになりたいと思ったことが開発のきっかけです。
似たようなサービスはたくさんあるんですが、スマホ、PCでもどちらでも操作できるようにしているのが最大のセールスポイント。
リアルタイムで別の人の動きも反映される、他の人の付箋に書き込めるなど、オフラインで付箋ブレストをしたときの体験を損なわないようにしています。
デバッグを地元の友達にとても手伝ってもらった。

【おしらせ】オンラインでリアルタイムにメモを共有して会議することができるWebサービス meeemo をリリースしました！！！https://t.co/I2kTWeP424スマホ🤳パソコン💻 などどのデバイスからでも会員登録なしで利用できます。どんなサービスなのか試すにはこちら👉 https://t.co/Mxgnha8tmB
— あんど＠クイズメーカーとか作ってるよ (@ampersand_xyz) 2018年6月14日

あと、このサービスリリースしたときに目出度くはてブのホッテントリ入リを果たしたものの、はてブ民がメチャメチャに押し寄せてきて祭り会場みたいになってしまっていました。
サーバーの負荷とか大丈夫かなと心配だったんですが、さくらVPS石狩リージョンサーバは偉大でした。
あと、メチャメチャセキュリティ攻撃を喰らいました。一部非常にマズイものとかがリリース時含まれていたんですが、ご連絡いただいて対応することができました。世間の優しさをここでも知ったのです。
そんでもって、付箋にdrop table users;とか truncate stickers;とか入れてた奴、未遂だけども許さんからな！！転んで擦りむいて泣け！！！

なんかちょっと見ない間に賑わっていて大変素晴らしいですね。遊んでくれるの感謝です、ありがとうございます。 https://t.co/Mxgnha8tmB #meeemo pic.twitter.com/ScFy4cjgWC
— あんど＠クイズメーカーとか作ってるよ (@ampersand_xyz) 2018年6月15日

ritwee

https://ritwee.top
6/20にリリース。

meeemoをリリースし終わってバカみたいにハイになっていたので勢いだけで作ったサービス。所要時間12時間ぐらい。
Twitterでくっっっっそ長文の投稿や、文中に写真を含めて投稿するのをもっと手軽にやれるようになったら良いのになということで制作。

大声でツイートしたり #ritwee https://t.co/7bK9GoY2Vt pic.twitter.com/b7hLPzMuiC
— ritwee (@ritwee2) 2018年6月20日

挿絵と小説を投稿したり（文章：青空文庫生い立ちの記より写真：ぱくたそより） #ritwee https://t.co/7bK9GoY2Vt pic.twitter.com/OUCeiOWcPk
— ritwee (@ritwee2) 2018年6月20日

#dist21 メモ #ritwee https://t.co/EbXeDigAUZ pic.twitter.com/D9lPq2KnPN
— あんど＠クイズメーカーとか作ってるよ (@ampersand_xyz) 2018年6月22日

ソースコードを投稿できたり、勉強会のときにガーッとメモを書いてまとめて投稿するなど割と便利なのですが全然人気出ず。
結局自分用に使ってますが割と愛着があります。
あと、独自のハッシュタグをtwitterのそれそのものの文字列に寄せたせいか、リリースした直後ハッシュタグ検索の検索結果に出てこないという現象に見舞われてました。ちくしょー（思い出し悔しい）。

ウェブ表彰

https://hyou.show

7/8にリリース。
開発者友達のプロダクトがめっちゃバズったことによる、嫉妬・礼賛・賞賛・羨望などあらゆる感情がミックスされて勢いで生み出された紹介ツイートではきれいな言葉で表現したけれども、実は割とカルマが深いサービス。ただし、どのシーンにおいても一切嘘は言ってない。
リリース直後は微妙にバズったものの、今はかなり静かなペースで動いてる。どこかの社内チャットでたまに使われているらしいという噂を聞いた。
おかしい…あんなに称え合ってたやろ…？？みんなどこ行ったの…？？？？

【おしらせ】最近自分の周りの人々が皆スゴいから「そうだ！！！褒めよう！！！」って思って、表彰状を贈れるサービスを作りました！！✨🎉✨ログイン不要で使えるので、良いと思ったことや頑張ってる人を気軽に表彰してください！！#ウェブ表彰 https://t.co/fc79jFfLEr
— あんど＠クイズメーカーとか作ってるよ (@ampersand_xyz) 2018年7月7日

クイズメーカー

https://quiz-maker.site

10/26にリリース。
クイズのを作って遊べるプラットフォームサービス。
10問クイズとかよくバズってるし良いよね〜というのと、自分の勉強用にゲーミフィケーションやりてぇ〜という思いで作成。
UIがわりと良い反応をいただけていて、そういったご意見を見るたびフフフってニヤニヤしています。見てるよ…。反応を書いてくれてる皆のことを見てるよ…。
CtoCのサービスを作るのははじめてで、人が来たりこなかったりするたびに一喜一憂するので育成ゲームをやっている気持ちというか…これはなんか不思議な体験という感じです。
最近はもっぱらこれの改善をやっている感じです。

【おしらせ】クイズを作ってみんなで遊べるプラットフォーム #クイズメーカーをリリースしました✨🥳おもしろクイズの作成はもちろん、最大10問の設問作成と択一／複数／文字入力での回答形式をサポートしているので試験勉強用に問題を作って練習することもできます📝💨https://t.co/KoTulqn18O
— あんど＠クイズメーカーとか作ってるよ (@ampersand_xyz) 2018年10月24日

2018年、あと何個サービス・アプリ作れるかな〜と思って過ごしています。
取り敢えず毎年運営をやっているクソアプリアドベントカレンダーというものがありまして、そちらに出すサービスを1個作るのは確定してるんですが、頑張ってもう一個ぐらい作れるように一生懸命生きてみようと思います。