タグ

ブックマーク / kachibito.net (27)

  • 直感でモバイルサイトのモックアップを作成出来るオンラインツール・Fluid UI

    結構良かったのでご紹介。スマフォ やタブレットなどのモックアップを 直感で作成出来るWebサービスです。 かなり簡単に作れるので選択肢の 一つとして覚えておくといいかもし れません。 有料ですが、結構良さそうなモックアップツールです。動作も軽くてサクサク作れます。 有料のモックアップツール。最安で月/29USDとなかなかの値段ですが、それに見合う機能だなぁとは思います。 パッと見、地味ですけど・・機能は結構凄い。触って頂くと直感で作成出来るのが実感できると思います。操作はドラッグでパーツを持っていって配置するだけ。Cacooを使う感覚に近いかも。※個人の感想です ↑ パーツは各種デバイスのものが用意されていますが、アップロードも可能です。アップロードはユーザー登録が必要です。 ↑ 何個も同時に作れます。ダブルクリックで新規モックアップ作成です。 ↑ 作ってて楽しい。 他、アニメーション遷移

    直感でモバイルサイトのモックアップを作成出来るオンラインツール・Fluid UI
  • Webサイトの制作スピードを、より向上させる目的で作られたスターターキット・99lime

    結構参考になったので備忘録がてら ご紹介。Webサイトの制作スピードを より向上させるために、汎用的なUI を集めて、マークアップも綺麗な状態 で済むように設計されたスターター キット、というかフレームワークです。 制作スピードを向上させる目的で作られたHTML5フレームワークです。レイアウトだけでなく、汎用的なUIも備わっていて、class名1つ付けるだけでタブやスライドショーを実装出来るようになっています。 そういった仕様にする事で、シンプルで綺麗で可読性の高いソースを保てるように設計されていたりと、結構参考になるスターターキットですよ。フレームワークは自作してるので良い部分を組み込んでみようかなと思いました。 タブやドロップダウン、スライドショーなどを備えているだけでなく、class名1つで実装出来るようになっているので、綺麗なソースを保持する事が出来るようになっています。 いろいろ

    Webサイトの制作スピードを、より向上させる目的で作られたスターターキット・99lime
  • 国内のiPhoneアプリでデザインが参考になったWebサイトいろいろ

    以前からちょいちょいブックマーク していたんですが、いつの間にか増 えてたので一覧化してみたいと思い ます。国内のiPhoneアプリサイトで Webデザインが参考になったサイトの まとめ。あんまり無いですが・・ 個人的な備忘録とメモ書きです。探し方も悪いと思いますので数はさほど網羅していません。「あそこ凄い素敵なのに載ってない」みたいなご意見ありましたらコメント欄にてご教授頂けますと幸いです。 この記事で見たいのはアプリではありませんのでWebサイトへのリンクしかありません。順不同となっています。シェア系アプリが多いです。 MogSnap べたものを写真で評価、共有するiPhoneアプリ。写真系なのでこういったスライドがあるとアプリの概要をイメージしやすいですね。無料であること、キャプチャ、アプリダウンロードのボタンが分かりやすく明示されています。 MogSnap 大辞林 言わずと知れた

    国内のiPhoneアプリでデザインが参考になったWebサイトいろいろ
  • スクリーンショットを撮るChromeエクステンションはAwesome Screenshotが一番良かった

    やっと捜し求めていたものに出会えた と思ったChromeのキャプチャ系のエク ステンション。いくつかあるんですが、 どれも微妙でした。で、ようやく自分の 求めていた機能を持ったエクステが 出てくれました。 Awesome Screenshotです。もう結構DLされてるんですね。人気のWebpage Screenshotが最近よくクラッシュするし、他のも微妙で困っていました。 ブロガーさんには特にオススメです。個人的に求めていたのは 軽量操作が楽多機能で無くていいからシンプルにページ全体を撮れるクラッシュしないという条件だったのですが、これらは全てクリア、クラッシュはまだ分かりませんし、環境によりけりでしょうけど・・更に編集機能まで付いています。何より、動作が軽いのが決め手でした。 使い方 DLするとアイコンが出ます。キャプチャを撮りたいページでアイコンをクリックすると「見えてる部分」か「全

    スクリーンショットを撮るChromeエクステンションはAwesome Screenshotが一番良かった
  • 今年(2011年)参考になったWeb制作者向けのスライドのまとめ - かちびと. net

    Web制作者というか、フロントエンド中心です。 WebデザインとかHTML5とかJavaScriptなどの スライドと、PHPなどが少し。タイトルで誤解 したらすみません。そろそろ年末年始の勉強 用に情報をまとめておきたいと思います。勉強 になるブログ記事!みたいなのはほっといても 誰かがまとめるんじゃないかな。 というわけで完全に自分用なのでいつも通り内容は偏ってます。一気にまとめて復習・・・出来るといいなwちゃんとアウトプットしないとダメですね・・とはいえ適当に端折ってます。そんな見る暇無さそうですし。 結構まとまりないです。 色彩センスのいらない配色講座

    今年(2011年)参考になったWeb制作者向けのスライドのまとめ - かちびと. net
  • スタイリッシュでシンプルなデザインのWordPressテーマを無料配布する・WPEXPLORER

    スタイリッシュでシンプルなデザイン のWordPressテーマを無料配布している WPEXPLORERのご紹介。基的には有料 ですが、一部を無料で配布してくれて いますので、好意にあやかろうかと 思います。 スタイリッシュで完成度も高いので組み込まれたスクリプトやコードも参考になりそうですよ。僕は独学なので、多くのコードは配布されているテーマから学びます。 以前は配布テーマを紹介していたそうですが、自分で作ったほうがいいのが出来る、という事で方向転換したそうです。その中で、一部を無料で公開(勿論GPLです)してくれているんですが、どれも有料のテーマ並みの出来で凄く参考になりますよ。 数自体は20個あるか無いかくらいですがどれも素敵なデザインです。以下に一部ご紹介します。 Showcaser クリーンでミニマルな2カラムギャラリーのテーマ。 CleanMag マガジン系のテーマ。無駄の無い

    スタイリッシュでシンプルなデザインのWordPressテーマを無料配布する・WPEXPLORER
  • WordPressのオリジナルテーマ作成フロー・基本マニュアル

    初めてWordPressオリジナルテーマの作成にトライしたい、という方向けの基のマニュアルです。マニュアルというほど大袈裟なものではありませんけど、ある程度敷居が低くなると嬉しいなぁという思いを込めて記事にします。 この記事の内容はあくまで基中の基で、初心者・ノンプログラマー向けとなっていますので応用的な情報は殆どありません。また、説明の仕方も分かりやすさ重視で、厳密的にはちょっと違う点もあります。 初心者さん向けに、もう少し情報があってもいいかなと思って、書いてみることにしました。僕もまだまだ初級レベルなので一緒に学んでいきましょう。初級者レベルでこんな記事書くなって話ですけども。 目次目次です。各セクションで必要と思う場所から見るようにしてください。 はじめに作成するWebサイトの目的と構造テーマ作成前に用意するものと環境テーマの構造を(触り程度だけでも)理解するHTMLからテー

    WordPressのオリジナルテーマ作成フロー・基本マニュアル
  • 完全無料でWordPressを使ったブログを始める7の方法

    WordPressを使ってみたい、でもサーバーを有料で借りても自分で運営できるか 分からないし不安でなかなか始められない。そんな慎重派な方に 「完全無料でWordPressでブログを始める方法」を7通りご紹介します。 簡単に言うとWordPressを使った無料ブログサービスなどのご紹介です。 これで使い方が分かればサーバーを借りる勇気も出るのではないでしょうか。 WordPress.com WordPressの無料ブログホスティングサービスです。ココは仮にレンタルサーバー を有料で借りて、WordPressを運営した場合でも恐らく登録する事になるので サーバーを借りる前に試したい方はココがオススメです。 WordPress.com CMS Square 無料のレンタルサーバーなのですが、CMSに特化しています。アカウントを 取ると自動インストールをしてくれます。WordPressだけでなく

  • 有料でもおかしくないようなクオリティの高いWordPressテーマを無料で配布しているサイトいろいろ - かちびと.net

    ご質問頂いたので記事にします。クオリティ の高いWordPressのテーマで無料のものは 無いか、または無料で手に入る方法は無い か、とのことでしたのでなかなかクオリティの 高いテーマを無料で配布してくれているサイト をいくつかご紹介します。 というわけで無料で手に入る、有料ライクなWordPressテーマを配布しているサイトのまとめ。ハイクオリティかどうかは個人差があるかなとは思います。 デザインはもちろん、テーマの機能をどういったコードで実装しているか、というのも参考になりますので開発目的に見ておいても損は無いかなと。 dessign swiss-missやonextrapixelでも評価されたデザイナー、クリエイター向けのテーマ。ホワイトベース中心です。有料版もありますが、無料版も見劣りしません。 example dessign Templatic TemplaticはCMSやポート

    有料でもおかしくないようなクオリティの高いWordPressテーマを無料で配布しているサイトいろいろ - かちびと.net
  • スマフォとかミニマルデザインに特化した、これからお世話になりそうなWebデザインギャラリー

    自分の中で課題があって、その為に 必要なインスピレーションを得るため のギャラリーサイトをまとめます。いち いちブックマークから探すのが面倒に なってきたのでちょっと整理がてら記事 にします。 というわけで個人的なリンク集です。スマフォとかミニマルデザインとかのWebデザインギャラリーいろいろ。デザインギャラリーですけど、目的はデザインというよりも、技術をどうやって上手く取り入れているかを見たい、という感じです。 ミニマリズム / シンプルミニマリズム、シンプルデザイン専門のギャラリー。 MNIMAL とにかくここ自体もミニマルなギャラリーです。よく見に行ってます。 MNIMAL siiimple シンプルレイアウトなWebデザインのみを集めています。 siiimple Minimal Exhibit ミニマルデザインを収集。少々カテゴリの分け方がアレ。 Minimal Exhibit m

    スマフォとかミニマルデザインに特化した、これからお世話になりそうなWebデザインギャラリー
  • WordPressを使ってWeb制作をする為の手順リスト・【改正版】+α

    以前書いたWordPressWeb制作する際 の手順リストが少し古い情報込みだったり するので改正版を書きます。先日、WPも 3.2のリリースを迎えましたので、手順リスト もアップデートすることにしました。多少考え が変わっているので内容も少し変更有ります。 以前のリストの改正版です。加えて他の情報も一緒に載せておく事にしました。 【2011・07・11】 WordPressインストールサーバーを用意(PHP5.2.4 以上 / MySQL5.0 以上)DBを作成WordPressをダウンロードし、解凍wp-config-sampleをwp-configにリネームし、内容をDBに合わせて変更プリフィクス(接頭語)を変更する(wp_→foodblog_)FTPソフト等でサーバーにアップロードサイト名やパスワード、IDを決める(adminは避ける)作成したユーザー名でログインダッシュボードの

    WordPressを使ってWeb制作をする為の手順リスト・【改正版】+α
  • シンプル / ミニマルなデザインのWordPressテーマだけを専門に紹介するWebサイト・Simple Themes

    シンプル、ミニマルなデザインのWPテーマ のみをひたすら紹介しているWebサイト・ Simple Themesのご紹介です。ミニマルな デザインは最近凄く人気が出ている印象 なのでご興味の有る方は探してみては如何 でしょう。 一時流行った、大量の装飾を施したデザインも最近はあまり見かけず、無駄を省いたミニマルなデザインが好まれるようになってきている気がします。 今日ご紹介するSimple Themesは、シンプルやミニマルなデザインのWordPressテーマのみを紹介するサイトです。 シンプルなテーマのみを集めているサイトです。今まで当ブログでご紹介してきたテーマもありました。 無料テーマ専門と有料テーマ専門があります。サブドメインで分けられているので探しやすいかと思います。 無料テーマ※公式サイトでの配布ではないので悪意あるコードにご注意くださいね。 Yoko Yokoは、css3のMe

    シンプル / ミニマルなデザインのWordPressテーマだけを専門に紹介するWebサイト・Simple Themes
  • グリッドレイアウトのクールなギャラリーサイトを構築出来るWordPressテーマ・Grid Locker

    見かけたことのないWPギャラリー テーマがあったのでメモ。美しい グリッドレイアウトとダークでクール なデザインが印象的です。いろいろ 多機能で完成度の高いので、この まま使用しても全然問題なさそう。 ギャラリー用のテーマは沢山ありますけど、Grid Lockerも他のテーマに負けず劣らず完成度が高いです。 ブラックカラーをベースとしたクールで重厚感あるデザインです。可変するグリッドレイアウトで時系列を崩すこともありません。 Lightbox Lghtboxによる画像ポップアップ。サムネイルおよび、横長の画像はカスタムフィールドを使用しているようです。名前を「Thumbnail」として、値に画像URLを入力します。画像はcacheフォルダに格納されるみたいですのでご利用の際はパーミッションにお気を付け下さい。 イメージスライド コンパクトなイメージスライドの有無を選択できます。スライドの画

    グリッドレイアウトのクールなギャラリーサイトを構築出来るWordPressテーマ・Grid Locker
  • 「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね

    Twitterに流れてきたスライドがとっても 分かりやすかったのでブログでより多く の方に拡散。ノンプログラマー向けの jQueryの基講座。これからjQuery を使おう、という方は読んでおくと良さ そうですね。 ノンプログラマー向けにjQueryの基礎をスライド化してくれています。 @pocotan001さん作のスライドです。 このスライドを見ながらコーディングする、というより、基礎知識を頭に入れるのに適したスライドだと思いますので気軽にご覧になってみて下さい。ハードルがかなり下がると思います。 また、当ブログでもjQueryプラグイン等の情報を取りあえげていますので合わせてどうぞ。 jQueryのリファレンスサイトと入門書籍 [2011.09.21アップデート] よくアクセスいただくのでハブ的な役割くらいは果たそうと思います。 jquery / jQueryの家です。jQuery

    「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね
  • 自分の心が疲れた時に、紙に書きだす15の言葉

    地震やその関連のこともそうですが、ここ1年ほど、個人的に自分の身の回りで色々な事があって、普段あまり気にしない性格なのに少し心が病んでいたと、今になって振り返って実感したのですが、なんとなく思いついたことを紙に書き出すことで少し精神的に安定した気がしました。 元々僕は少し気にし過ぎる面があるので、ちょっとした自己啓発的なものを(依存しない程度に)与えないと不安定になるようです。という訳で、自分の心に効かせる15の安定剤を書いてみるテスト。 自分で思ったことだったり、どこかで見かけた言葉だったり、というものも含まれているかも知れませんが、よく脳裏によぎったり、紙に書き出す言葉です。イメージするだけでなく、紙に書きだす事で自分の心に強く言い聞かせます。 思ったより人は自分を見ていない昔はコンプレックス(容姿も含めて)が多々有りましたが、ある時、叔父にこう言われて随分楽になりました。「お前、随分

    自分の心が疲れた時に、紙に書きだす15の言葉
  • [2010年度版] 今年に入ってブックマークした無料のソフトを整理・16個+まとめ記事いくつか

    今日は2010年度版のフリーソフトまとめ です。今年、ブックマークした無料のソフト を整理しました。結局残ったのは16個と まとめ記事がいくつか。折角整理しました のでついでにまとめてご紹介してみます。 かなり主観が入っていますので内容は 偏っていると思います。 という訳で、2010年度版・無料でDL出来る素敵なソフトのまとめです。試してみて凄いなーと思ったもの、まだ試していないものなど混在していますがご了承下さい。 日語で紹介してくれている記事にリンクしていますので詳細はそちらでご確認下さい。 順不同です。 【追記・当方WinユーザーでMac持ってないです。このまとめもそんな感じです】 複数のパソコンで簡単にiTunesを同期できる『MediaRover』 これはなかなか便利そう。試す機会がまだ無いので試していませんが、いつかテストしてみたいです。 複数のパソコンで簡単にiTunesを

    [2010年度版] 今年に入ってブックマークした無料のソフトを整理・16個+まとめ記事いくつか
  • 最近見かけた色々な「フリーのWordPressテーマ記事」から選んだ素敵なテーマ集

    最近見かけるWordPressのテーマ のまとめ記事で気になったテーマを いくつか備忘録的に選んでまとめて みます。当にクオリティは増すば かりでユーザーにとってはありがたい ですね。 尚、中身を見たものと見てないもの、実際に使ったものと使ってないものが有ります。利用に関しては自己判断なさるようお願いします。 Antlantis Flashのインパクトすごいテーマです。ぬるーっと切り替わる。 Antlantis Boldy フェードインアウトするTOPバナー、プルダウンメニューやサーチボックスにもjsが使われています。 Boldy Imbalance なかなか素敵。ポートフォリオ向けですかね。マウス乗せるとキャプションが表示され、画像は背景に。 Imbalance Shaken Grid 可変式のリキッドレイアウトを実装出来るテーマです。色合いも綺麗ですね。有料版もありますが、こちらは無

    最近見かけた色々な「フリーのWordPressテーマ記事」から選んだ素敵なテーマ集
  • HTMLをWPテーマ化する時の手順リスト

    WordPressWPテーマ化手順 一般的なHTMLファイルをWordPressの テーマにする時の手順と、使用するタグ をリスト化、というか自分用チートシート。 いつも子ページが時間掛かるので、単純 な構成のHTMLなら、テーマ化くらいは サクサク終わらせたいですね。 一般的なHTMLファイルをWordPressの テーマにする時の手順と、使用するタグ をリスト化、というか自分用チートシート。 いつも子ページが時間掛かるので、単純 な構成のHTMLなら、テーマ化くらいは サクサク終わらせたいですね。 唯一の方法では無く、ベーシックな方法です。僕も一度作成してから必要に応じて別のタグを使います。 WPテーマ化手順リストSTEP.1HTMLをindex.php、header.php、footer.php、sidebar.php等に分割。分割に関しては以前の記事をご参照下さい。 以下のインクル

    HTMLをWPテーマ化する時の手順リスト
  • WordPressチートシートいろいろ・SEOとかテンプレートタグとか

    以前、WordPressのコードチートシートをご紹介しましたが、 Graphic and Web Design Blogで、様々なWordPressの チートシートやリソースが紹介されていましたので、チートシート15個のみ ご紹介します。 WordPress Help Sheet (*.pdf) 以前、日語チートシート色々でご紹介したWordPressチートシート。 日語に訳されてます。 WordPress Help Sheet (*.pdf) The Advanced WordPress Help Sheet (*.pdf) カテゴリやタイトル等に使えるスニペット集。開発者向け。 The Advanced WordPress Help Sheet (*.pdf) WordPress Template Tags Cheat Sheet (*.pdf) テンプレートタグの一覧をチートシー

    WordPressチートシートいろいろ・SEOとかテンプレートタグとか
  • まずは基本から・HTML5のCanvasについて参考になったサイトまとめ

    WebデザインHTML5 Canvas ようやくHTML5に興味を持ち 始めました。サンプルを以前 記事にして、凄いなーと思っ ていましたが、なかなか時間 がなく、先延ばしに。 ようやくHTML5に興味を持ち始めました。 サンプルを以前記事にして、凄いなーと 思っていましたが、なかなか時間がなく、 先延ばしに。で、ようやく頭に入れ始めま した。なにするにも行動が遅くて困ります。 HTML5でも話題になっているCanvasを勉強し始めました。そんな中で、勉強の参考になりそうなサイトをブクマしたのでこれから学ぼう、とお考えの方とシェアしたいと思ってエントリー。 というわけで、基的な情報がほとんどです。大量の情報を見ても混乱するのである程度絞っています。 html5.jp リファレンスサイトです。リンク先はcanvasカテゴリに。ここからスタート、というか最後までたぶんお世話になりそう。 ht

    まずは基本から・HTML5のCanvasについて参考になったサイトまとめ