LINEスタンプがやっと承認された!!
勢いで作ったスタンプがやっとこさ承認されたぞー!忘れてたぞー!
作成経緯
- 会社辞めて暇だった
- 何しよう
- LINEスタンプでも作るか!!
- でも絵描けないしPhotoshopやIllustrator使えない・・
- 手描きの絵でどうにかして作れないかな・・
LINEスタンプ 手描き
検索!- どんぴしゃな記事に出会う!出来る!
参考
【超初心者向け!!】秒速でLINEスタンプを自作する方法!|合同会社チームサンタ
の記事を参考にして作っていった。
とてもわかりやすく書かれていて参考になりました。ありがとうございます!
絵を描いてスタンプにするのはとても簡単。
スタンプを2040個考えて絵にする時間・気力・体力があれば誰でも作れる。
申請〜承認〜販売まで
細かい日付は残していなかったので曖昧
- 2014年9月某日
- LINEスタンプ作成開始
- 2014年9月23日
- 2014年11月末日
- スタンプのステータスが審査中に!
- 2015年2月27日
- LINE Creators Marketよりスタンプ承認のメールが!
- マイページにアクセスしてリリースボタンをぽちっと
- 2〜3時間でストアに反映されて購入可能に!
膨大なスタンプが申請されていると思うので、申請から承認まで半年位はかかりそう。
忘れかけてたよね・・・
リジェクトされずに一発で審査が通り、無事にストアに並んでいるので感動しました。
やり切れたので、自分で自分を褒めます。
作成したスタンプ
私立恵比寿中学さん大好き大好きという気持ちのまま勢いで作ったもの。
なぜこの名前にしたのか、など殆ど覚えていないが、
- 私立恵比寿中学
- エビ中
- シリツエビチューTシャツあったなぁ
- チュー・・・チュー・・・チューケン!忠犬ハチ公!
- 柴犬にシリツエビチューTシャツっぽいの着せよう!
- 字が入らない!チューが限界!
- (シリツエビ)チューが大好きな犬
- チュー犬!!
こんな感じ。アイドルが好きな柴犬が何かしてるスタンプ。
※私立恵比寿中学さんとは一切関係ありません。好きなだけです
公式でかわいいスタンプ出してくれないですかね〜
ロボサンのはあるけど・・・
形態素解析&マルコフ連鎖を使って文章をつぶやくTwitter botを作った
Rubyでtwitter botを作った。構想から完成まで約3ヶ月 何だかんだでものすごく時間がかかってしまった。。。
どうせなら使ったことのない言語で作りたかったので、Rubyに挑戦してみることに。
gitもまともに使ったことがなかったので、bitbucketでソースコードの管理をしながら作った。
完成するまでの流れを残しておく。
Rubyでtwitter botを作る方法を調べる
とにかくググる
- 10分でできるTwitter bot @ Ruby - 酒と泪とRubyとRailsと
- RubyでTwitter botを作る準備 - .logbook
- Twitter Botを、RubyとMongoHQを使って作ってみたのでまとめておく - is Neet
- rubyでtwitterbotを作ってみる | happymeme
- twitterのbotはrubyでチョチョイのパー
どうせだったらHeroku
使いたい(少しだけ使ったことあるから)
Herokuを使う方法を調べる
とにかくググる
調べていく中で、形態素解析
・マルコフ連鎖
という言葉を知る。
定期的につぶやくなら、決まった言葉をランダムにつぶやくだけじゃ面白くないので形態素解析
とマルコフ連鎖
を使ってみることに!
形態素解析&マルコフ連鎖について調べる
- テキストマイニングの初歩 Rubyで形態素解析を行う〜ruby-mecab | Scimpr Blog
- rubyで自分のツイートデータから頻出語を見つける - くろの雑記帳
- マルコフ連鎖でTwitter BOTを作る - FLYING
- TinySegmenter: Javascriptだけで実装されたコンパクトな分かち書きソフトウェア
- 2.pythonで対話型AI制作[形態素解析] - Just $ A sandbox
- 0.pythonで対話型AI制作 - Just $ A sandbox
Mecabを入れてみる
require 'natto' nm = Natto::MeCab.new nm.parse('今日も100%スマイルサーブ。テニスの王女様。鈴木裕乃です。') do |n| puts "#{n.surface}\t#{n.feature}" end
今日 名詞,副詞可能,*,*,*,*,今日,キョウ,キョー も 助詞,係助詞,*,*,*,*,も,モ,モ 100 名詞,数,*,*,*,*,* % 名詞,サ変接続,*,*,*,*,* スマイル 名詞,一般,*,*,*,*,スマイル,スマイル,スマイル サーブ 名詞,サ変接続,*,*,*,*,サーブ,サーブ,サーブ 。 記号,句点,*,*,*,*,。,。,。 テニス 名詞,一般,*,*,*,*,テニス,テニス,テニス の 助詞,連体化,*,*,*,*,の,ノ,ノ 王女 名詞,一般,*,*,*,*,王女,オウジョ,オージョ 様 名詞,接尾,人名,*,*,*,様,サマ,サマ 。 記号,句点,*,*,*,*,。,。,。 鈴木 名詞,固有名詞,人名,姓,*,*,鈴木,スズキ,スズキ 裕乃 名詞,固有名詞,人名,名,*,*,ひろの,ヒロノ,ヒロノ です 助動詞,*,*,*,特殊・デス,基本形,です,デス,デス 。 記号,句点,*,*,*,*,。,。,。 BOS/EOS,*,*,*,*,*,*,*,*
できた!
(鈴木/裕乃にするためにMecab辞書に名前追加してます)
色々調べてなんとなくわかったので、実装の方針が固まる
実装方針決定
- エビ中さん大好きなのでエビ中さん関連で
- フォロワーさんのツイート+歌詞の一部を合わせたリストを形態素解析
- 解析したものをマルコフ連鎖を使って文章組み立て
- つぶやく&リプライの作成
- 生徒の名前が含まれていたら、該当生徒がよく使う顔文字(アメブロより拝借)をランダムで付与
と、方針が決まったので実際にコーディング
問題発生and回避
- Mecabでやろうとしたけど、herokuには入れられない!!
- okura使う???試してみたけどwakati書きに時間がかかりすぎぃい(やり方が悪い?)
- 形態素解析は YahooのAPIを使うことに
- API制限があるが、24時間で50000回制限&1リクエストで100kbだったから大丈夫
- 1時間に1回ツイートを取得→形態素解析して辞書を作り直す
- 取得するツイート数は最大600にすれば制限に引っかからない
実装の参考に(ほぼ丸写しに)させて頂いたコードなど
Twitter Streaming API・Rubyのクラス分け
- TweetStream::Client
Twitter gemおよびTweetStream gemでストリーミングを受けてみる
なお、TweetStreamは背後でEventMachineベースのem-twitterが動いているので、並行処理を行う際にはEventMachineを使います。例えば
(前略)
EM.run do
EM::PeriodicTimer.new(5) do
puts Time.now
endclient.userstream do |object|
puts "recieve a tweet / class: #{object.class}"
puts object.text
end
end
とすれば5秒おきに時刻を表示しつつTLのツイートを表示してくれます。- クラス分けはまるっと参考に
- タイムラインからのツイート取得参考に
形態素解析&マルコフ連鎖
- マルコフ連鎖の部分はまるっと参考に
- Yahoo日本語形態素解析APIのgem
- 日本語形態素解析API
Heroku関連
- branchをHerokuにpushしたい
- https://devcenter.heroku.com/articles/git
Branches pushed to Heroku other than master will be ignored by this command. If you’re working out of another branch locally, you can either merge to master before pushing, or specify that you want to push your local branch to a remote master. To push a branch other than master, use this syntax:
$ git push heroku yourbranch:master
- https://devcenter.heroku.com/articles/git
- ローカルでの動作確認/foreman/.env
- https://devcenter.heroku.com/articles/procfile
Config vars saved in the .env file of a project directory will be added to the environment when run by Foreman. For example we can set the RACK_ENV to development in your environment.
echo "RACK_ENV=development" >>.env
- https://devcenter.heroku.com/articles/procfile
いろいろあったが何とか完成!他のエビ中関連botさんと会話しつつ、全く役に立たないbotは元気に稼働しています。内容は意味不明・・・
キングオブ学芸会bot (@kogakugeeeekai) | Twitter
これお気に入り
— キングオブ学芸会bot (@kogakugeeeekai) 2014年8月14日
あの強敵ボス“テスト”と戦ってきちゃった! #ebichu #エビ中
— キングオブ学芸会bot (@kogakugeeeekai) 2014年8月14日
参考にさせていただた皆様に感謝!
プログラムはなぜ動くのか ― 知っておきたいプログラミングの基礎知識をやっと読んだ
プログラムはなぜ動くのか ― 知っておきたいプログラミングの基礎知識
- 作者: 矢沢久雄,日経ソフトウエア
- 出版社/メーカー: 日経BP出版センター
- 発売日: 2001/09/27
- メディア: 単行本
- 購入: 21人 クリック: 513回
- この商品を含むブログ (81件) を見る
数年前に買ってちらっと見て本棚の片隅に置いてあったのをやっと読んだ。
まだまだ理解できない部分もあったが、今までこんなことも知らずにプログラマとして働いていた自分恐ろしい((((;゚Д゚))))
読んでよかった。第2版を電子書籍で買ってた事を思い出したよ・・・
第1章 プログラマにとってCPUとはなにか
- プログラム→コンピュータに実行させる処理の順番を示すもの→命令とデータ
- プログラムはメイン・メモリに
- 命令やデータはメモリのアドレスに格納される
- CPUがプログラムを実行
- CPU→制御装置+演算装置+クロック信号+レジスタ
- レジスタ→アキュムレータ・インデックスレジスタ・フラグレジスタ・プログラムカウンタ・汎用レジスタ
- アセンブリ!!!
第2章 データを2進数でイメージしよう
- ICのピンは1本で2つの状態を表す
- 32ビット・マイクロプロセッサは情報を入出力するためのピンを32本持っている!(衝撃
- 一度に32桁(32ビット=4バイト)の2進数の情報を処理できる!(衝撃
- シフト演算
- 補数(よくわかってない
- 論理右シフト、算術右シフト
- 論理演算
第3章 コンピュータが少数計算を間違える理由
この章は全然わからなかった・・
第4章 四角いメモリーを丸く使う
- メモリーの実態はICと呼ばれる電子部品
- アドレスを指定してデータを読み書き
- アドレスはデータを格納する場所を示すもの
- メモリーの論理的なイメージはビルディング
- ポインタ→データの値そのものではなく、データが格納されているメモリーのアドレスを持つ変数のこと。
- 配列
- スタック→LIFO(Last In First Out)
- Push, Pop
- キュー→FIFO(First In First Out)
- Put, Get
- リングバッファ
- リスト要素
- 2分探索木(聞いたことある
第5章 メモリーとディスクの親密な関係
- プログラムは記憶装置に格納されていて順次読み出されて実行される
- フォン・ノイマン
- パソコンにおける記憶装置→メモリー、ディスク
- ディスクに記憶されたプログラムがメモリーにロードされてから実行される
- ディスクアクセスを高速化→ディスクキャッシュ(メイン・メモリー内の領域)
- ディスクをメモリの一部として使う仮想記憶→ページング方式、セグメント方式
- ディスクの物理構造
- 一般的なパソコンではセクター方式
うーん。
第6章 自分でデータを圧縮してみよう
- ファイルにはバイト単位で記録
- ランレングス法(?
- ハフマン法(???
ここもよく理解できず
第7章 プログラムはどんな環境で動くのか
- 動作環境 = OS + ハードウエア
- AT互換機とかx86とか
うーん?
第8章 ソース・ファイルから実行可能ファイルができるまで
- コンピュータはネイティブ・コードしか実行できない
- ソースコードを翻訳するのがコンパイラ
- コンパイルだけでは実行可能ファイルが得られない(!
- コンパイルに続けて「リンク」という処理が必要になる(!!
- コンパイラは実行前にソースコードをネイティブコードに一括して翻訳。インタプリタは、実行時にソースコードの内容を1行ずつネイティブコードに逐次変換
10年前の新人研修でC言語の上っ面をかすっただけなので全く理解できず。。。
インタプリタの実行イメージがわからん。
実行時にネイティブコードに逐次変換したネイティブコードがメモリにロードされてから実行されるのかな??
第9章 OSとアプリケーションの関係
- システムコール
- OSと高水準言語がハードウエアを抽象化
流し読み
第10章 アセンブリ言語からプログラムの本当の姿を知る
- アセンブリ言語はネイティブコードと一対一に対応(!!!
- ネイティブコードへの変換プログラムが「アセンブラ」
- アセンブリ言語や、アセンブリ言語で書かれたプログラムのことをアセンブラと呼ぶ場合もある
- コンパイラでアセンブリ言語のソースコードを生成(!!! gccでやったら本と違うの出てきた!今度見る
- ネイティブコードに変換されない擬似命令
- アセンブリ言語の構文は「オペコード+オペランド」
- CALSにトライ!
アセンブリ言語面白かったから、もう少し勉強する(予定
第11章 ハードウエアを制御する方法
- ハードウエアとの入出力を支えるのはIN命令とOUT命令
- 周辺装置の割り込み
- DMA
流し読み
第12章 コンピュータに「考え」させるためには
- 人間の考え方をプログラムで表す(YES!
- 人間の癖をプログラムで表す(ほぅ
- 記憶を生かすことで、より人間らしい判断を行う(なるほど
第2版買っていたのでそっちも読みます。
コンピュータともう少し仲良くなったら今からでも成長できるかな!!!
jQueryのeachを読む
コードリーディングの第一歩として自分が読みやすいJavaScriptを読むことに。
jQueryのソースコードを読むための参考サイト20選 - DQNEO起業日記
を参考にして、よく使うeach
メソッドを読んでみる。
ソースコードビューアあったから、古いバージョンとメソッドの内容を比較するのにいいかもしれない。
よく使う方法
このようなhtmlがある時に、li
を1つずつ取り出す。
<ul> <li>(・∀・)</li> <li>(*´Д`)</li> <li>(・∀・)</li> <li>(*´Д`)</li> <li>(・∀・)</li> </ul>
$('li').each(function(i, elm) { // elm == this console.log(i + $(elm).text()); // 0(・∀・) のように表示される });
eachメソッド
// args is for internal usage only each: function( obj, callback, args ) { var value, i = 0, length = obj.length, isArray = isArraylike( obj ); if ( args ) { if ( isArray ) { for ( ; i < length; i++ ) { value = callback.apply( obj[ i ], args ); if ( value === false ) { break; } } } else { for ( i in obj ) { value = callback.apply( obj[ i ], args ); if ( value === false ) { break; } } } // A special, fast, case for the most common use of each } else { if ( isArray ) { for ( ; i < length; i++ ) { value = callback.call( obj[ i ], i, obj[ i ] ); if ( value === false ) { break; } } } else { for ( i in obj ) { value = callback.call( obj[ i ], i, obj[ i ] ); if ( value === false ) { break; } } } } return obj; }
eachメソッドについての疑問
- eachの第3引数
args
は何か?使うの?
第3引数args
がある場合はapply
、ない場合はcall
を使っている。apply
とcall
って何だっけ? $.each($('li'))
と$('li).each
両方使えるよね?
1. eachの第3引数args
は何か?使うの?
applyとcall
全く読んでいなかったサイ本の出番!第5版しかもってないからそれを引っ張り出して読む。サイ本、いい本ですよね。
- 作者: David Flanagan,村上列
- 出版社/メーカー: オライリージャパン
- 発売日: 2012/08/10
- メディア: 大型本
- 購入: 12人 クリック: 252回
- この商品を含むブログ (18件) を見る
P.138 8.6.4 apply()メソッドとcall()メソッド
の部分より引用
2つのメソッドを利用すると、あるオブジェクトのメソッドであるかのように関数を呼び出すことができます。call()メソッドとapply()メソッドの最初の引数は、これから呼び出す関数の対象となるオブジェクトで、関数の本体のthisキーワードの値になります。call()メソッドの2番目以降の引数は、これから呼び出す関数に引数として渡されます。
apply()メソッドとcall()メソッドの違いについては、
apply()メソッドもcall()メソッドと同じような働きをします。ただ、関数に渡す引数を配列形式で指定する点が異なります。
なるほど。第3引数のargs
は配列形式で渡してあげると。
第3引数args
を試す
試しに第3引数を渡してeach
を実行してみる。
// callback関数の引数に第3引数で渡した配列の値が入る。 $.each(['a', 'b', 'c'], function(a, b) { console.log(this); // String {0: "a", length: 1} console.log(a); // 1 console.log(b); // 2 }, [1, 2]); $('li').each(function(a, b) { // elm == this console.log($(this).text() + ':' + a + ' :' + b); // (・∀・):3 :5 }, [3, 5]); // 第3引数は配列形式じゃないといけないので、以下はエラーになる $('li').each(function() { console.log(this); }, 'test');
ここまで見て思ったのは、each
に第3引数を渡して使ったことないこと。
使い方としては以下のような感じ?うーん・・・
// こういう使い方は出来るのか? $.each([1, 2, 3], function(x, y) { console.log(this + ':' + x + ':' + y); // 1:5:10 console.log((this + x) * y); // 60 }, [5, 10]); // わざわざ引数で渡すならこうするかな? $.each([1, 2, 3], function() { var x = 5, y = 10; console.log(this + ':' + x + ':' + y); // 1:5:10 console.log((this + x) * y); // 60 });
まて。each
メソッドにコメント書いてあった。
// args is for internal usage only
argsは内部利用のためにのみ使う??よくわからなかった。。
第3引数なしの場合はcallback.call()
が実行される
args
がない場合のコメント
// A special, fast, case for the most common use of each
eachの一般的な使い方ってことかな??
配列じゃなくてオブジェクトもOK
// オブジェクトもいける // callback関数の引数には`key`と`value`が入ってくる $.each({'test': 123, 'test2': 'あいうえお'}, function(key, value) { console.log(key, value); // test 123, test2 あいうえお console.log(this); // Number {}, String {0: "あ", 1: "い", 2: "う", 3: "え", 4: "お", length: 5} }); // `i`にはindex, `v`には値が入ってくる // この場合は this == v var obj = $.each([1, 2, 3, 4, 5], function(i, v) { console.log(i + ':' + this); // 0:1, 1:2, 2:3, 3:4, 4:5 console.log(i + ':' + v); // 0:1, 1:2, 2:3, 3:4, 4:5 }); // each関数はobjをreturnするのでこうなる console.log(obj); // [1, 2, 3, 4, 5]
2. $.each($('li'))
と $('li').each
両方使えるよね?
$('li').each(function(i, elm) {});
の場合は以下が呼ばれる。
// Execute a callback for every element in the matched set. // (You can seed the arguments with an array of args, but this is // only used internally.) each: function( callback, args ) { // callbackにfunction(i, elm) {} が入る return jQuery.each( this, callback, args ); // eachメソッドを呼ぶ。thisは$('li') },
jQuery.each
を呼んでいるので、 $.each($('li'), function(i, elm) {});
となる!
DayOneに投稿するブックマークレット
DayOneの使い方を見直そうと思い検索していて見つけた記事
DayOneをWebクリップに変えるブックマークレット DayOneClip - W&R : Jazzと読書の日々
素晴らしい!
普段はChromeを使っているので、Chromeにブックマークレットを登録して実行!
便利だわー。
DayOneのURL schemeはこちらに
DayOneはYouTubeの動画も再生出来るらしい。
DayOneにYouTubeの動画もクリップできるようにしました DayOneClip - W&R : Jazzと読書の日々
YouTube動画貼り付け版を試してみたが、画像が表示されるだけで再生出来ず><
ブックマークレットのコードを見てみると、
if(/m\.youtube\.com/.test(url))
youtubeのurl判断が m.youtube.com
になっていたので、この部分を変更することに。
元のブックマークレットはモバイル版のリンクを使っている模様。
自分の使い方だと、
がいいので、以下のようにブックマークレットを変更させてもらった。
javascript:title=document.title;url=location.href;clip=title+"\n";if(/.+\.youtube\.com/.test(url)){id=url.split("v=")[1];clip+=url+"\nhttp://youtube.com/watch?v="+id}else{text="";p=document.getElementsByTagName("p");for(k in p) text+=p[k].innerText;text=text.replace(/\n/g,"").replace(/undefined/g,"").substr(0,100);clip+=url+"\n<img src=http://capture.heartrails.com/300x200/?"+url+" style=\"border-radius:10px;margin:1px 15px 1px 1px;box-shadow:1px 2px 3px gray;\">\n"+text+"...\n"}location="dayone://post?entry="+encodeURIComponent(clip);
このブックマークレットを登録して実行するとDayOneにリンク情報が転送されて。。。
Done
をクリックすると http://youtube.com/watch?v=xxxxxx
のurlの動画が表示されて再生出来る!
出来ました!
winerosesさんありがとうございます!!
Webサービスのつくり方ー「新しい」を生み出すための33のエッセイを読んだ
Webサービスのつくり方 ~「新しい」を生み出すための33のエッセイ (Software Design plus)
- 作者: 和田裕介
- 出版社/メーカー: 技術評論社
- 発売日: 2012/11/20
- メディア: 単行本(ソフトカバー)
- 購入: 29人 クリック: 685回
- この商品を含むブログ (27件) を見る
Webサービスの過程を考慮してエッセイ風に語っている本。
各章を読んで印象に残った事と感想をメモ。
取り敢えず何かつくろう
第1章 心構えと下準備
- ぐだぐだ言ってないでコードを書けよ、ハゲ
- 実現していない、カタチになっていないことにはあまり価値がない
- 唯一重要なものはコードなんだ。
- Mac一つあれば開発出来る!
- なければつくる
- ブログは自分自身を成長さえるよい鍛錬の場
- 勉強会は面白くて、いい仲間ができる場所
- 3回繰り返すことがあれば共通化を考える
コード書く前に色々調べて時間だけが過ぎて結局何もできてない。。って事ばかりなのではっとさせられた。
第2章 企画
- 次の7つの項目を決めること
- 哲学
- アイデア
- テーマ
- コンセプト
- 名前
- デザイン
- 内部設計
- 哲学
- 個々人が持っている、特定の興味に関する揺るがない気持ちのこと
- アイデア
- 哲学を叶えるための個別の具体的なアイデア
- テーマ
- 哲学をより具体的にした、勝負する領域のこと
- コンセプト
- テーマに沿った、アイデアを形成するための骨格
- デザイン
- コンセプトやアイデアを洗練させていくと無駄なものが削ぎ落され、サービスやアプリに対する最低限の機能が抽出されます
- 紙にUIのイラストを書くような作業を、何度も繰り返すとよい
- 内部設計
- ユーザーから見たシステムの振る舞いを書いてから作業に移るとよい
- アイデアは新しい組み合わせ
哲学!!!
アイデアは組み合わせ!これは自分も思っていたこと。
第3章 設計
今までユースケースって書いたことがなかったが、これから書いてみよう。
抜けがなくなって手戻りしなくなりそうだし、実装方針を固めるのに役に立ちそう。
第4章 開発
ここあまりついていけなかった。。実際にコードを書きながらもう一回読んでみよう。
perlやってみようかな。。
第5章 プロモーションと運用
- そのサービスが何を目標としていて何ができるのかだけでも最低限文章として書けるようにしておく
- プレストか拡散とか
- システム運用とコンテンツ運用
- サーバ構成
- キャッシュ
- スケールアップとスケールアウト
- やり方は一つじゃない
ここもついていけていない・・><
サーバ構成とか超苦手部分だ。
運用していてもサーバ構成や負荷について全く気にしたことなかったからなー。
一人で運用までやってみると、こういう事も経験するからやるしかないと思った。