2018年11月16日

エディ太郎のアイコンを変えた

前回の記事でアイコンを変えたい、なぜなら元のアイコンは改名前のアプリ名「dddraft」を模したものだから。 という話を書きました通り、さっそくアイコンを差し替えた「エディ太郎 1.3.0」をリリース致しました。

エディ太郎 - 下書き専用テキストエディタ

メールやチャットへ投稿する前に、下書きを書くための *ファイルを編集できない* テキストエディタ

新アイコン

前回のアイコンに引き続き、グラデーションを取り入れたデザインとなっています。 個人的にリニューアル後の Instagram アイコンが好きで、どこかでモダンな感じのグラデーションを使いたいと秘めていた気持ちがありました。 それっぽいのになってうれしい。それっぽいのになってるかな?

ちなみにこのアイコン、HTML と CSS で作りました。 ↑ に表示されているのも実は画像ではありません。 以下のちょっとしたコードで描画されています。

<div class="editaro-icon">
  <div class="editaro-icon-inner"><div class="editaro-icon-prompt"></div></div>
</div>
.editaro-icon {
  width: 260px;
  height: 200px;
  background: linear-gradient(to bottom, #ea27ff, #0069ff);
  border-radius: 16px;
  margin: 50px auto;
  padding: 8px;
}
.editaro-icon-inner {
  position: relative;
  width: 100%;
  height: 100%;
  background: #000;
  border-radius: 10px;
}
.editaro-icon-prompt {
  position: absolute;
  top: 18px;
  left: 20px;
  width: 10px;
  height: 50px;
  background: #fff;
}

モダンブラウザ以外だと崩れてるのかも?(未確認)

これを Chrome に表示させたらスクショしてフォトショで空白部分を調整するだけ。アプリ用に electron-icon-generator を使ってパッケージングすると完了です。Instagram 公式アイコンみたいに”本物のデザイン”をするには物足りないですけど、簡単なパーツで構成するちょっとしたアイコンならこんな方法で十分なんですよね。

もう一つのエディ太郎

今すぐダウンロード
今すぐダウンロード

あまりにもエディ太郎を理解したアイコンが突然飛んできました。 ダサ感を出しつつも知っててやっているこの感じ。 30 億のデバイスで走らせる高い志を予想させます。 このままこれを利用させてもらうのも良かったのですが、 今後エディ太郎の運命がどうなるかわからない (そのつもりはないですが、シェアウェアになったり、問題が起きて叩かれの対象になる可能性も 0 ではない) ため、自前のものを引き続き利用するかとなりました。 thx! @lunar0

これはこれで、「テキスト侍」みたいな名前で、別のアプリ作っても良いかも。