Tag: 配布

配布タグの付いた記事

Gapplin 1.1

先日1.0をMac App StoreからリリースしたSVGビューアGapplinですが、数日前から1.1が公開されています。

1.1では以下の点が新しくなりました。

自動ダークモード機能を追加（イメージが白ベースのときに自動的にダークモードに切り替わります）

SVG(Z)ファイルのQuick Lookサポート

現在のファイルサイズを情報バーに表示

書き出しフォーマットにTIFFを追加

イメージを常にウインドウの中心に表示

ダークモードのときはスクロールバーが明るい色調に

フルスクリーンに対応

対応言語にドイツ語を追加

修正: SVGのソースにwidth/heightの記述がない際に、書き出されるイメージのキャプチャ範囲が間違っていることがあった

修正: 初回のイメージ読み込み中にウインドウタイトルが表示されなかった

修正: カラーパネルのアルファチャンネルスライダーが表示されないことがあった

修正: いくつかのメモリリーク

ほか微調整

おもに1.0で間に合わなかった機能の追加になりますが、結構変わってます。目玉は自動ダークモード、Quick Lookの2つになるかと思います。

App Storeで1.0をダウンロードした方はおそらく既に自動的にアップデートされていることでしょう。

そもそもGapplin入れてない人はこれを機会にぜひー。

Gapplin - SVG Viewer for Mac

先日つくったよ、と書いた OS X用のSVGビューア Gapplinですが、このたびめでたくMac App Storeで公開のはこびとなりました。というか、10日ほど前から既に公開されていたのですが、こちらのブログでの連絡が遅くなってしまいました。

もしβ版を使ってみた方がいらしたら、ぜひApp Storeから正式版をインストールして下さい。

詳しい説明は前回のブログに譲りますが、簡単に書くとGapplinはSVG画像ビューアです。WebKitレンダリングで、普通のSVGを始めSVGZやアニメーションSVGのプレビューをします。このソフトウェア自体にはSVGの編集機能はありませんが、Gapplinで開いたSVGを外部ソフトウェアで編集すると、リアルタイムでビューを更新してくれるので、テキストエディタでのSVG編集の際の表示確認に特に最適な仕様になっております。

SVGを頭っからテキストエディタで書く奇特な人はあまりいないでしょうが、IllustratorやSketchなどで作成したSVG画像を最後テキストエディタでクリーンナップするようなことは多いと思います¹。

もちろん単なるプレビューアとしても。OS Xで気軽にSVGZ開けないの不便よねー。

また、そもそもこのGapplinは私が以前から開発していたCotEditor用のSVG編集スイートをもっと便利にしたいがために開発されたので、このGapplinの公開を受けて、大元のSVG編集スイートの方もGapplinを使う仕様に書き換えました。こちらもあわせてお使いください。

つまり、Gapplin + CotEditor + CotEditor用SVG編集スイートの3つがあれば、OS XでのSVGテキスト編集はカンペキということになります。CotEditorでサクサクSVG書いて、表示はGapplinで確認。CotEditorでセーブしたら自動的にGapplinは更新されるし、xmlにシンタックスエラーがあればそれも表示されるし。べんりー。

β版から大きく変わったところは...なんだろう。安定性が向上しました。あとソースコードはもうAppleScriptObjCじゃなくなっちゃいました。今は全部普通のObjective-Cで書かれています。

正直最初のAppStoreの申請は、落ちるんじゃないかと高をくくっていて、さらにAppStoreはレビューに入るまでに最低1週間かかると聞いていたものですから、こんなにすんなり申請が通ってしまうとは思わなかったのです。submmitしてから4日ほどで In Review になり、そのレビューを抜けたのがなんと12分後。速すぎだろ...。いやたしかに問題がない限りはボタン一個押すだけくらいの流れ作業なんだろうけれども。ちょっとダメ出しとか受けてみたかった気もする。ということで心とサイトの準備が何もできていないまま公開してしまったのでした。

なお、ただいまQuick Lookプレビュー等を搭載したv1.1を申請中なので、うまくいけば今年中にさらに強化されたGapplinをお届けできることと思います。1.0は書き出しの範囲指定にちょっとミスがあるのでその辺りは1.1で直ります。GUIのプログラミングもたのしいねー。

ということで、よろしくお願いします。というか、宣伝活動を全然していないのでだれか広めて...。

このようなGUIソフトの吐くSVGソースは大概ムダが多いので、テキストエディタで最後掃除をするとけっこうファイルサイズを抑えることができます。

Gapplin 1.0β公開

OS X用のSVGビューア、Gapplinというソフトウェアを開発してみました。現在、専用サイトでβ版を配布中です。（JAVAとかAppleScriptとかを除けば）一応1024jp史上初のMacネイティヴアプリケーションになります。

SVG専用のビューアということでこのソフトウェアが必要な人口は少ないかとは思いますが、その分使う人にはかなり便利なソフトウェアに仕上がったと思うので、SVG愛好家の皆様におかれましては、ぜひ使ってみて下さい。

previews of lastUpdatedHeader — カスタム新着位置画像

BathyScpaheの新着位置画像（新着レスの頭に表示されるバー）を色々整理したので、カスタム用画像としてBathyScapheWikiに上げてもらいました。内訳はBathyScaphe v2.1で新しくなった新着位置画像で没になったヤツとか、カラーバリエーションとかです。

カスタム用なのでちょっと遊んだ色や文字のない不親切なデザインとかを含めました。長いバーについては、v2.1から搭載されたウィンドウサイズに合わせてスレッド領域いっぱいに広がる仕様が採用されています¹。

v2.1が出たときに近日中に配布すると言っていたわりには大分間が開いてしまいましたが、いやーこれ結構書き出しがめんどくさいんです。

画像自体はただのディバイダーなので、その気になればいくらでもバリエーション作れるんだけどね。

本当はSVGで書いて使う人が色を気軽にカスタムできるようにしようかと思ったんだけど、SVGは読み込んでくれなかった。SVGはPreviewでさえ開いてくんないからな。

ダウンロードはこちらから。

カスタムアイコン - BathyScapheWiki

あーそっか、デフォルトの新着位置画像のカラーバリエーションも作ればよかったかな。これもそのうち。

仕様はPDFにまとめられ "新着位置画像の拡張仕様について" としてBathyScapheWikiで公開されています。Wiki

ミニ・ソーシャル・アイコン -追加3

またちょっと増やしました、web素材ミニ・ソーシャル・アイコン・シリーズ。6個増やして総計89個になりました。

なんかごちゃごちゃしてきたので一覧を配置し直した。

追加分は上から順番に以下のようになってます。

- App.net
- Bēhance
- WordPress
- Hatena Blog
- TINAMI
- LINE

最近ひっそりApp.netやってるのでそれを追加するついでに。App.netのロゴってどれなんだろう。faviconモデルに作ったけど。まぁまだα版だもんね。App.netはもう少しブランディング頑張って欲しいなぁ。

他の追加はまぁ、需要がありそうなのを。今回はメジャーどころが多いかな。

ダウンロードはこちらから。

Works > Web Design > ミニ・ソーシャル・アイコン

累計ダウンロード数現在4桁、なんだけどどこで使われてるんだろーね。

このブログはサイトの更新に触れたり触れなかったり一貫性なくてってどうなのって自分でも思っているのですが、気分次第です。更新をもれなくチェックしたい場合は素直にサイト更新フィードをフォローして下さい。

GeekToolでオリジナル天気アイコン

CleanArchiver Original Icon — これの天気アイコン3つ部分

えっと、訊かれたのでGeekToolでオリジナルの画像を使って天気予報を表示するスクリプトをGitHubに置いてみました。私が以前晒した自分のデスクトップで使ってるヤツです。

weatherIcon-geeklet

横着して以前書いたのをそのまま抜き出して説明すると、

お天気アイコンはYahoo! Weather APIから天気コードを読み込んで、それを元にこっちで用意した天気アイコン画像を選んで表示する、という手はずを踏んでいます。ここはPerlでスクリプト書いてGeekToolで蹴ってます。アイコンはフォントのお天気記号をベースにIllustratorで作ってpngで書き出し。

といった流れを大まかに踏んでます。

もともと自分さえ使えれば良いという考えのもと作ったので、設定方法が煩雑なのですが、それでも良いという方はお試しください。検索してみたら意外と見当たらないもんで、こんなのでも役に立つかもしれない。そのような性質上、「なんもわかんないけど難しくてできません！！」みたいな質問には冷たいかもしれません。もちろんバグとか常識的な範囲の質問には答えますが。

やり方とかは中の README_ja.md を見てください。使用しているサービスの仕様上、取得できる天気は当日と翌日のみとなります。

気温の表示についてはGeekToolで天気予報の最低/最高気温表示参照して下さい。

ミニ・ソーシャル・アイコン -追加2

またちょっと増やしました、配布中のweb素材ミニ・ソーシャル・アイコン・シリーズ。6個x1列増やして計78個です。

追加分は上から順番に以下のようになってます。

- Open Share Icon
- Geotag
- OPML
- 500px
- togetter
- twilog
- flavors
- posterous
- Pocket

Shareaholicの汎用アイコン系とか、前回言ってた twilog とか togetter とか足しました。あとは公式が変更になったヤツとか。

ダウンロードはこちらから。

Works > Web Design > ミニ・ソーシャル・アイコン

Vim Replacement Icon

代替アイコン作ったよー。ここにきてVimですよ、Vim。

まぁご存知のように根っからのCotEditor愛用者なのですが、それでもEmacsかVimかと訊かれたらVimかなぁ、Terminal上でテキストファイル触らないといけないときはVim使うし。なんてね、まぁ単純にVimのアイコン触りたかった。

今回は基本的な意匠は全く替えないというルールの元に作成しました。独自のアレンジは一切せずに質感だけをモダンでリッチに。

個人的な思想から言うと、アプリケーションアイコンは具象的なモチーフで成り立っているべきだと思っているので、こういう文字だけのアイコンは好きではないのですが（某adobeシリーズとか某MS Officeとか）、これは代替アイコンであり、かつ作成動機が「今のアイコンをリッチにしよう」なのでオリジナルに倣ってます。

作成ツールは相変わらず終始Illustratorで。Illustrator CS3で作るアイコンもこれが最後、次回はCS6だな。

基本的にはベースはMacVimなのですが、せっかくマルチプラットホームなVimなので、Windows用のicoファイルも作ってみたり、それ以外にもUnix系でも自前で作れるようにPNGファイルも同梱してあります。最大サイズは1024px。

ダウンロードはdeviantARTから。どうぞよろしく。

Vim Icon by ~1024jp -deviantArt

CotEditorで画像のbase64埋め込み

webサイトに画像を表示させるときに、HTMLやCSSで画像ファイルのパスを指定してを呼び出すのではなく、画像ファイルをテキスト形式にエンコードしてそれを直接ソースに記述するという方法があります。

たとえばCSSで画像を追加したいとき、普通は

h2::before { content:url(../images/file.png) }

のように、CSSファイルから挿入したい画像のファイルのパスを指定しますが、画像データをbase64という形式でテキスト化することにより以下のように書くことができます。

h2::before { content:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAALBJREFUeNpiZACCyorK/9LS0gzo4P379x/evn3rMGHihIsoEpMmTvr/588fDLx+/fr/3V3d7/Ny8/RhaplAxL9//xj+//+PgTk5ORmysrMEZGSkD+RkZ+sjafiLVcP3798Zdu7cySAtIyPAzMx8AKSWBdkGdODs7AyWA4Enjx8LENTAxsYGZzMyMjIQ1IAMYDYNUg2ijx4+ZOjp7sarARhKIEoc5HVxIOZnIA58AQgwABZHliIIeBqFAAAAAElFTkSuQmCC) }

これで、この場合は file.png という画像データをテキスト形式で記述したことになり、これ以上サーバに file.png のファイルを上げる必要もありません。

CSS/HTMLファイルに直接画像も記述してしまえばそこから"画像ファイルを呼び出す" というトラフィックがなくなるので、サーバ負荷の軽減・表示速度の向上に繋がる、というテクニックです。大きい画像はテキスト化するとえらいことになるので、リストのマーカー画像や繰り返しの背景素材のような小さな画像データに向いています。

まぁ、詳しくはその辺を丁寧に解説してるサイトを検索して読んでください(雑)。

本題は、「それをCotEditorでやるマクロを書いたから配布するよ」っていう方です。CotEditorのスクリプトメニューから実行するとファイルを選択するダイアログが出るので、挿入したい画像ファイルを選ぶとカーソル位置にbase64にエンコードされた画像データが挿入されます。Terminalを触ったりオンラインプログラムに頼ることなく、CotEditorだけで作業が完結するので、画像のテキスト埋め込みが気軽にできるようになるのではないでしょうか。

[screen shot] — screen shot: ダイアログから選択した画像をbase64エンコード

当サイトのCotEditor用マクロ配布ページからダウンロードできるようにしました。

CotEditor用マクロ -Goodies -Works //ヴォルフロッシュ

画像データのbase64化というのは実はSVGでラスター画像を扱う上で重要な要素で、このスクリプトもSVG Suite用に書いたものが元なのですが、多分SVGをCotEditorで書くより画像のCSSファイル埋め込みの方が需要があると思われるので、単発の選択画像をbase64にエンコードするだけの版を作成しました¹。良ければお使いください。