タグ

ブックマーク / webimemo.com (18)

  • [報告]Chrome即反映が魅力の快適テキストエディタ『Adobe Brackets』がなかなか良い感じだったよ

    先日、勉強会でAdobe Bracketsをはじめて触ってきました! 私はST2に恋している身なのでそこまで興味はなかったのですgげふんげふん!これ、使ってみたらなかなか良かったのですよ…! なので、今日はそこで学んできたAdobe Bracketsの魅力と、コーダー必須アイテムであるEmmet(Zen-Coding)のインストール方法を皆さんにご紹介したいと思います!! というわけで、@stocker_jpさんがオープンされた教室『Stocker.jp / Space 』にて行われた@glatyouさんのAdobe Brackets勉強会にいってきました。 こういう勉強会に参加して、アプリケーションに触れてみるのって大事ですねー。ST2の時も触るまで微塵も興味なかったなぁ…w Adobe Bracketsとは Adobeから出ている無料のテキストエディタです。CCに加入している必要はなく

    [報告]Chrome即反映が魅力の快適テキストエディタ『Adobe Brackets』がなかなか良い感じだったよ
  • すべてのアプリ製作者に捧ぐ!アイコンデザインのギャラリーサイト『iconDrop』をリリースしました。

    こんにちは。みぞれです。最近アプリのデザインをするようになって アイコンのサンプルが大量に欲しくなったので、思い切ってサイトにしてみました。 日のサイトだからこそ国産アプリ多めです 海外のギャラリーサイトもクオリティが高く参考にはなるんですが、私たちが作るのは日人向けのアプリ。やっぱり参考にするのも国産アプリのアイコンの方がしっくり来ると思うのです。 とくに上記のような日独特のアイコンデザインをしたい時はやはり国産アプリから探さねばなりません。 (画像のアプリはこれから登録予定です・・・ごにょごにょ) 色別、タグ別、タイプ別、カテゴリ別。 アイコンを探す時に色(ベースカラー)から絞れたり、タグから絞れるように作りました。 色 時には「女の子向けだからピンク系でいきましょう!」などと、色から始まる製作もあると思います。そんな時は色で絞ればOKです。 タグ 例えばクライアントさんに「

    すべてのアプリ製作者に捧ぐ!アイコンデザインのギャラリーサイト『iconDrop』をリリースしました。
  • [アプリ]注目の記事をまとめ読みできるiPhoneアプリ『FeedDrop』をリリースしました[作ってみた]

    こんにちは、霙(@xxmiz0rexx)です! 最近ロクにブログも書かずに何をしていたかと言いますと、水面下でいろいろな事に首を突っ込んで活動をしておりました。その中の1つを日発表させて頂きます :) ユニットを組んで、iPhoneアプリを共同開発しました!! 自由大学でiOSアプリの作り方を学んでから半年ほどが経過したでしょうか。 作る作ると言って全然X-Codeを起動する時間もなく年を越してしまったとある冬の日、 友人のデベロッパーさんと打ち合わせ後にアプリの話になったのがキッカケになりました。 「一緒になにか作りたいよね」 「いいね!おもしろそう!!」 「……じゃあいつやるか?」 「「今でしょ!!!!!」」 という会話があったかなかったかは置いておいてw やるなら今!!ってことで、そこから約1ヶ月ほどでアプリが完成いたしました :) アプリ名はFeedDrop(フィードロップ) 雨

    [アプリ]注目の記事をまとめ読みできるiPhoneアプリ『FeedDrop』をリリースしました[作ってみた]
    poyosi
    poyosi 2013/03/19
    Feedrop!!!ぞれさんアプリも作ってたのか∑(゚Д゚)!!!
  • メインマシンをWindowsからMacにした時に教えてもらった「Macではこれできないの?」→「できるよ」Tips

    2011年7月にMacBook Airを購入して約1年半。 職場でもメインPCWindowsからMacにして頂けたこともあって 段々と扱いに慣れてきた霙(@xxmiz0rexx)です。 今回はそんな私の「Windowsでできたアレ、Macではできないの??」 という購入当初の疑問とその答えをまとめます。 まだMacに慣れていない人、もしくはこれから購入を考えている人はチェックしてみてください! 1.保存しますか?「はい」「いいえ」をキーボードで WindowsではYとNでできたアレ。Macではどちらのキーを押してもうんともすんとも言いません。 おまけにタブキーを押しても無反応。 解決法 Macにもショートカットキーがありました! 保存しない→⌘D キャンセル→esc 保存する→return これずっと悩んでいたので解決した時のスッキリ感がやばかったw 例えるなら「スゲーッ 爽やかな気分だ

    メインマシンをWindowsからMacにした時に教えてもらった「Macではこれできないの?」→「できるよ」Tips
    poyosi
    poyosi 2012/12/03
    (:.;゚;Д;゚;.:) スクショの⌘+Shift+Controlでクリップボード行きになるのは知らなかった…
  • 恋する速度を爆速化。Sublime TextでZen-Codingを使用する際の設定メモ

    先日「恋に落ちるエディタ」Sublime Textの勉強会に参加してきた霙(@xxmiz0rexx)です。 エディタの便利さ、優雅さ、魅力などを語るのは別の機会にするとして、 今回はそのSublime Textで、爆速コーディング用プラグイン「Zen-Coding」先生を使えるようにする設定方法を学んできましたので、備忘録もかねて記事にしたいとおもいます。これから使ってみようと思っている方は是非! Sublime TextにZen-Codingプラグインを入れる手順 他のアプリみたいに設定画面で操作できないので変な感じですが、やってしまえば意外とあっさり終わります。 1.Sublime Textをダウンロードする まずはSublime Textがなくては始まりませんね。 公式サイトに行ってダウンロード、そしてパソコンにインストールしましょう! 参考:Sublime Text: The te

    恋する速度を爆速化。Sublime TextでZen-Codingを使用する際の設定メモ
  • Google Analytics APIを使って、プラグインに頼らずに記事のアクセスランキングを表示しよう[ wordpress]

    こんにちは、霙(@xxmiz0rexx)です。 サイトにGoogle Analyticsを導入していることが条件ですが、APIを利用すればプラグインに頼らなくても記事のアクセスランキングが表示できることを最近知りました!色々カスタマイズもしてみましたので、以下に手順とサンプルコードをメモしていきます。 1:GAPI(GAPIGoogle Analytics API PHP Interface)をダウンロード まずは下記のサイトからライブラリが入っているzipファイルをダウンロードします。 gapi-google-analytics-php-interface 2:example.report.phpの中身を編集 次に、ダウンロードしたzipファイルを解凍し、中に入っているexample.report.phpを編集していきます。 下記のサンプルは結構盛りだくさんなので要らない部分は外し

    Google Analytics APIを使って、プラグインに頼らずに記事のアクセスランキングを表示しよう[ wordpress]
  • アプリレビューサイトとかに使えそう。カスタムフィールドに入れたURLをQRコードに変換させる方法。

    スマートフォンアプリの紹介記事などで、ダウンロード用のQRコードが表示されているとそのまま端末からアプリをダウンロードできて便利なわけですが、APIとカスタムフィールドを使ったら思っていたよりも簡単にその仕組みを作ることができました。 参考にした記事など 何だかしばらくWordPressを触っていなかったら、もはや初対面みたいな、よそよそしい感じになってしまいまして、 WordPressで何が出来るのかまったく分からない記憶喪失状態になってしまったので、まずはひたすらググるところから始めましたw そこで見つけたのが以下の記事。 お手軽WordPress Tips:URLやサイズを指定出来るQRコードをショートコードで作れるようにする – かちびと.net ご質問頂いたのでついでに記事にします。 WordPressでURLとかサイズを指定出来る QRコードをショートコードで作成したい、 とい

    アプリレビューサイトとかに使えそう。カスタムフィールドに入れたURLをQRコードに変換させる方法。
  • スマホでお絵かき♪ボールペンみたいで描きやすいペン先が透明なスタイラスペン「JOT」を買ってみたよ!

    こんにちは!絵がド下手で、たまにアップしてはTLでdisられまくっている霙(@xxmiz0rexx)です。 絵はヘタクソですが、描くことは好きなので無駄に2目のスタイラスペンを買ってみましたので記事にしますね! ペン先の比較 今まで私が持っていたのはこちらのペン先がぷにぷにしたスタイラスペン。 暇な時に触るのがすごく気持ちいいペンなんですが、若干描きにくいんですよね。。 ペン先が太いので、このように着地点が見えないのです。 一方、今回購入したJOTはこのようにペン先が透明のプレートになっています。 画像のとおり、ペンの着地点が見えるので非常に描きやすいのです♪ JOTでいろいろ描いてみました♪ お気に入りのお絵かきアプリAdobe Ideasで描いてみましたよー! Adobe Ideas – ベクトル線画とイラストレーション カテゴリ: エンターテインメント, 仕事効率化 すたーばっくす

    スマホでお絵かき♪ボールペンみたいで描きやすいペン先が透明なスタイラスペン「JOT」を買ってみたよ!
    poyosi
    poyosi 2012/07/02
    使ってみたけど、これよいよな…!!! iPadユーザーは特にオススメのペン
  • サイトに外部ブログのRSSを表示する方法と、記事タイトルが長すぎる場合に省略表示する方法メモ。

    今更ですが、Google Feed APIを利用してRSSを取得・表示する方法と、そのタイトルをCSSで省略表示させる方法を学びましたのでメモメモ。 みんなだいすきGoogle Feed API サイト制作の際、トップページなどに外部ブログのRSSを表示させたいときってありますよね。 私は過去にバンドの公式サイトを制作していた時、メンバーのブログRSSを表示させてくれとよく頼まれたものです。 (その時は無料RSSサービスを使っていました・・・) そんなときに役立つのがGoogle先生による『Google Feed API』。 表示件数や表示させたい内容、それを囲むタグなどわりと自由にカスタマイズできるので多くのWEB屋さんに愛されているようです。 何かいい方法はないか呟いたところ、多くの方からこちらを薦めていただきましたヾ(*´∀`*)ノ ちなみに、以前はAPIキーを取得する必要があったよ

    サイトに外部ブログのRSSを表示する方法と、記事タイトルが長すぎる場合に省略表示する方法メモ。
  • CSS3備忘録:疑似クラスを使ってtableの最後の縦列をborderで囲む方法

    何かの表を作るとき、最後の列に合計の数値を表示することがあると思いますが、 その最後の列を強調するために太めのborderで囲んで欲しいという要望を受けた霙(@xxmiz0rexx)です。 表の向きを横にすればtrで簡単に指定できるのでしょうが、そうもいかない場合があるのですw 地道なだけの、ただのCSSの設定ですが、次からコピペしたいので記事にしちゃいます。 html <table> <tr> <th>商品名</th> <th>金額</th> <th>数量</th> <th>Total</th> </tr> <tr><td>石仮面</td><td>500</td><td>2</td><td>1000</td></tr> <tr><td>マンモーニ</td><td>105</td><td>1</td><td>105</td></tr> <tr><td>ニーソ</td><td>30,000<

    CSS3備忘録:疑似クラスを使ってtableの最後の縦列をborderで囲む方法
  • ウェビメモ

    こんにちは!みぞれ(@xxmiz0rexx)です。 すごいニッチかもしれないんだけど、WordPressでカテゴリ一覧を表示している時に、さらに記事を絞り込むためにタグ一覧を表示することってありますよね? そんな時はWordPress Codexにも載っている以下の方法を参考にする人が多いと思うんですが、実はこれだと下書きなどに設定しているタグも出力されてしまいます。 PHP <?php if ( is_category() ) { // 現在のカテゴリーのIDを取得 $cat_id = get_query_var( 'cat' ); // 表示中のカテゴリーに属する投稿のIDを配列で取得 $current_posts = get_objects_in_term( $cat_id, 'category' ); // 表示中のカテゴリーに属する投稿に付けられたタグの情報をまとめて取得 $cu

  • Dropboxに保存したhtmlファイルをiPhoneで閲覧する方法メモ。

    最近疑問だったことがやっと解決したので記事にします。 地味に悩んでいる人や、方法を忘れてしまう人もきっといると思うのでその時はこの記事を見て思い出してくださいw iPhoneで見られるようにする手順 1.Publicフォルダにhtmlファイルと画像など一式を置く 2.htmlファイルを右クリックし、パブリックリンクのコピーを選択 3.そのコピーしたURLをiPhoneのsafariで開く。これだけ!! パソコンと同じノリで、iPhoneからも直接dropboxアプリからhtmlファイルを開いていたんですが、 どうにもCSSや画像などを読み込んでくれず、すごく悩んでいました。 safariからパブリックリンクを開けば良かったんですね!またやり方を忘れたらこの記事を見ようと思いますw 以上、霙でした!

    Dropboxに保存したhtmlファイルをiPhoneで閲覧する方法メモ。
  • WordPress管理画面にオリジナルメニューを追加した時の手順メモ

    前回もちらっとメモしたんですが、 もっと具体的な内容も覚えておきたいので改めて実際のコードとともに手順をメモしたいと思います。 オリジナルの管理画面を用意しておくと、クライアントさんがサイトの更新を行う場合に安心して更新をお任せできますw ゴールはこれ。 不要なダッシュボードウィジェット、左メニューなどをすべて非表示にし、 オリジナルで用意したヘッダー&メニューを差し込みます。 デフォルトの管理画面は高機能な分、メニューがずらーーーっと並んでおり WEBに詳しくない方にとっては何が何だか分からないものですからね。 ここは一思いにばっさりと切り捨て、クライアント専用にやさしいシンプルな見た目の管理画面を用意してあげることで 大幅に間違いが減りますし、説明の時間も短縮できると考えてます。 ちなみに、上記キャプチャに表示されているメモは『Headache With Pictures』というプラグ

    WordPress管理画面にオリジナルメニューを追加した時の手順メモ
  • Illustrator備忘録:放射状ストライプの簡単な作り方とそれをPhotoshopのカスタムシェイプに登録する方法

    前回のIllustrator備忘録を喜んでくれた方がいらっしゃったので第二弾を書いてみます。 今回は放射状ストライプ(別名サンバースト)の簡単な作り方と、作った放射状ストライプをPhotoshopのカスタムシェイプに登録する方法です。 またもやイラレ使いさんには当たり前の技かと思われます。 放射状ストライプはよく見ると三角形がまるく並んでるだけのものですので、めちゃめちゃ簡単に作ることができます。 それをカスタムシェイプに登録しておけば、使いたいときにすぐ使えるのでとても便利です♪ ①Illustratorを開き、長方形ツールを選択 ②アートボード上でクリックし、今から作る長方形の幅と高さを指定します ③ペンツールを選択します ④ペンツールで長方形の底辺の中心をクリックし、アンカーポイントを追加する ペンツールがパス上に来ると+のマークが出るので、そのタイミングでクリックするとパス上にアン

    Illustrator備忘録:放射状ストライプの簡単な作り方とそれをPhotoshopのカスタムシェイプに登録する方法
  • 2011年総まとめ!商用可能素材、WEB系知識などなど今年わたしがお世話になったWEBサイト10選。

    わたしにとってのブログ元年がもうすぐ終わろうとしています。 今年はこのブログを立ち上げ、良くも悪くも生活が一変した年でありました。 そんな激動の年の最後の記事は、感謝の記事で締めくくりたいと思います。 なお、単純にお世話になったサイト様だと数が多すぎるので、わたしが今年 頻繁に足を運ばせて頂いた事が選定の基準となっております。 商用可能な素材系 9search 何度お世話になったか分からないくらい頻繁にアクセスさせて頂いております! 商用可能でクレジット表記不要なフリー素材を探す時に、わたしが必ず最初にのぞきにいくサイト様です。 パーツごとにわかれていたり、サムネイルを表示してくれていたりでとても探しやすいです! PAKUTASO/ぱくたそ 商用可能な写真素材サイト様です! 高画質でノイズ処理なども施されているため、他よりも目を引くクオリティの高い写真素材が沢山あります。 なにか写真が必要

    2011年総まとめ!商用可能素材、WEB系知識などなど今年わたしがお世話になったWEBサイト10選。
  • jQueryを使ったスムースなタブメニュー

    素晴らしく気持ちのいい動きをするタブメニューに出会ったので光の速さで実装してみました。 これは個人的にかなりオススメです!!2008年産みたいなのでもしかして知っている方も多いかも。 前々からサイドバーで記事をランダムピックアップする事に憧れを抱いていたのですが、これ以上サイドバーが長ったらしくなるのが嫌でなかなか実装せずにおりました。 ですが今回WEBクリエイターボックスさんのリニューアル で使われていたタブメニューを触って惚れ込んでしまいまして、当サイトにも実装してみました :) 配布サイト様 yensdesign 海外サイトなので英語ですが、わりと読みやすいと感じました。 記事の上の方に「Tested in: Firefox, Internet Explorer 6 & 7, Opera, Safari & Chrome.」との表記があるので、なんと近々死ぬであろうIE6,7(※)で

    jQueryを使ったスムースなタブメニュー
  • Illustrator備忘録:奥行きのある絵に平面の図をはめこむ方法

    最近 仕事でIllustratorを使う機会が増え絶賛勉強中なのですが、 こんな便利な機能があったとは知らなかったのでメモ。 世のデザイナーさんからしたら常識なのかもしれませんが、こういう場合は『エンベロープ』という機能を使うのですね。 例えばこのようなモニターの絵に、 こんな感じの図をはめこみたい状況があったとします。 (どちらもIllustrator上でパスがきってある状態です) そんな時は、オブジェクトメニューにある『エンベロープ』機能を使うとカンタンにはめこむ事ができるのです :) ①はめこみ先の四角を選択し最前面に配置する ついでに平面の図をグループ化しておきましょう。 ②はめこみ先の四角とはめこみたい平面の図を両方選択 ③オブジェクトメニューからエンベロープ→最前面のオブジェクトで作成を実行 ④おわり。 こんなにカンタンにはめこむ事ができましたっ! たぶんコレ学生さんでも知って

    Illustrator備忘録:奥行きのある絵に平面の図をはめこむ方法
  • jQueryを使ってIE6でもリンクファイルの拡張子ごとにアイコンを表示させる方法。

    リンクをクリックした時、ゆっくりと、そして心なしかドヤ顔でpdfが開き始めたら 「あんたバカァ?!」と思いませんか。私は思います。 そんな事態を防ぐには、リンクの横にアイコンを表示させておけばバッチリです。 今回はそれをCSS3ではなくjQueryセレクタを使って再現してみました。 IE6じゃなかったらCSS3で実現できたのに・・ 私もCSS3を使っていいならば話は早かったのですが、諸事情によりIE6対象のサイトなので諦めました。 最近話題のCSS3を利用した方法は以下の記事で紹介されています:) ちなみにかちびとさんの方はEXCELがEXILEになっちゃう不思議な魔法がかかっているので注意してくださいw 参考:[CSS]リンク先や拡張子ごとにリンクのアイコンを変更するスタイルシート | コリス 参考:地味に使えるCSS小技のメモ&サンプル集 – かちびと.net そんなわけで潔くIE6で

    jQueryを使ってIE6でもリンクファイルの拡張子ごとにアイコンを表示させる方法。
  • 1