「速攻！１時間で作るPRサイト」 | ヘッドウォータースのブログ TechNote
1. 無料ハイクオリティーなテンプレートを見てみよう！ 2. ここだけは押さえろ！コンテンツ作成のポイント 3. Railsに速攻デプロイ 上記3つを抑えて、短い時間でハイクオリティなサイトを作ろう！ 1. まずは、無料ハイクオリティーなテンプレートを見てみよう！ 百聞は一見にしかずといいますね。 まずは、テンプレートのクオリティーをチェックしてみましょう。 ちなみにすべて、レスポンシブです！ かっこよくないですか？？ このクオリティーで無料なら、一からつくるのなんて馬鹿らしくなってきません？？ 「うんうん。馬鹿らしくなってきた(読者の声)」 ですよね。じゃまずは、イケてるテンプレートを探してみましょう！ おすすめのサイトを３つご紹介します。 Free Responsive HTML5 CSS3 Website Templates HTML5 UP! Responsive HTML5 an
2014年9月の、これだけは押さえておきたいWeb関連の動き
「Web系の最新情報を知りたいけど、日々業務が忙しくて追いかけられない」という方のために、1ヶ月のWeb系ニュースの中で「これだけは押さえておきたい」というものを1つの記事にまとめています。 デザイン関係 これからはGIFアニメからAPNGの時代に！ iOS 8でサポートされたAPNG画像を使いこなそう – ICS LAB 「APNG」とは「アニメーション可能な PNG 画像形式」のことで、PNG と同様に 8bit（256色）や 32bit（アルファチャンネルあり）などがサポートされます。 Can I use… Support tables for HTML5, CSS3, etc を見ると、2014年9月末時点では Firefox、iOS 8 くらいしか対応しておらず「これは当面使えないな…」と思っていたのですが、この記事によると「JavaScriptライブラリのapng-canvas
Webデザイナーが捗る！知識を増やす最近のトレンドまとめ
作成：2014/09/29 更新：2014/11/01 Webデザイン > Webデザインの流行りを知るために、トレンド感のある配色や洗練されたレイアウトをつくり上げるために、知っておきたいことや方法など。他に、Web制作において今後積極的に挑戦してみたいものをまとめました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ 配色 １．ネオンカラー ２．washed out ３．グラデーション ４．マテリアルデザイン 模様 ５．ジオメトリー 背景 ６．背景色を時間の経過で変化させる ７．スクロールで背景固定、コンテンツだけ動かす 一部に動きをつける ８．シネマグラフ ９．線画 (SVG) １０．グリッチ UI・他 １１．ゴーストボタン １２．プレースホルダー １３．ローディングエフェクト １４．pushState １５．ドロアー レイアウト １６．タイルレイアウ
動きがユニークで参考になるメニュー系のUIアニメーションまとめ10選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
どうもです、フロントエンドエンジニアのはやちです( ˘ω˘)✌ 最近、編集長の朽木さんが一部の方々から「くーにゃん」と呼ばれているのですが、私から「くーにゃん」と呼ぶのは馴れ馴れしすぎるので「くーにゃんさん」と呼んでしまう次第であります。 はい(◞‸◟) さて、今回は動きが面白いUIを集めてみました！ 1つ1つアニメーションを確認しながらご覧いただけるとうれしいです( ˘ω˘)☝ 今回は紹介するアニメーションは全部で10個です( ˘ω˘)☝ 1. GIF Sticker App – Dribbble https://dribbble.com/shots/1719325-GIF-Sticker-App サイドメニューが斜めに表示するパターン、要素もくるくる動いております( ˘ω˘)☝ 2. Home Guard 02 – Dribbble https://dribbble.com/shots
[CCL web vol.6] 2014年のWebデザイントレンドと 本当に必要とされるデザインと手法
6月25日（水）、竹橋マイナビルームにてマイナビ様が主催する「Creator’s Career Lounge（以下、CCL） vol.6」が開催され、FICCから戸塚、福岡、冨田、STANDARD社から鈴木 健一氏が登壇しました。「Webデザイントレンドの潮流」をテーマに、これまでのWebデザインが歩んだ歴史と背景、そして現在Webの現場で活躍するWebデザイン技法についての講演のスライドです。 ・FICCは一緒に働きたい人を募集しています。 【詳しくは】 http://www.ficc.jp/recruit/ ・STANDARDは、スマートフォンアプリやWebサイト Webサービス等のUIデザインに特化したプロダクションです。 人の役に立つアプリやサービス制作に携わりたい人を募集します。 【詳しくは】 http://www.standardinc.jp ・Web業界で活躍したい人のための
![[CCL web vol.6] 2014年のWebデザイントレンドと 本当に必要とされるデザインと手法](https://cdn-ak-scissors.b.st-hatena.com/image/square/553b114c1d27ed1c0846b1a36a93b06d4bfd371f/height=288;version=1;width=512/https%3A%2F%2Fcdn.slidesharecdn.com%2Fss_thumbnails%2Fcclslide20140708-140717040232-phpapp01-thumbnail.jpg%3Fwidth%3D640%26height%3D640%26fit%3Dbounds)
AdminLTE·ここまで多ければ何でもできそう。多機能なBootstrapベースの管理画面テンプレート MOONGIFT
これで十分でしょ！ Bootstrapで作る管理画面は相当増えてきているようです。確かに一般ユーザ向けに提供するとBootstrap臭が出てしまいますが、管理画面であれば問題はないですよね。 ということで今回は新しいBootstrap製の管理画面テンプレートAdminLTEを紹介します。高度なウィジェットが数多く提供されていますので使い勝手良さそうですよ。 AdminLTEの画面 今回もスクリーンショット多めで紹介します。 ダッシュボード。この時点でかなりリッチ。 ボックス。これだけ多彩なパターンがあると言うのも凄いですね。 左端にはちょっとした設定を表示させています。 背景色を変えるだけでも随分印象が違います。 グラフ。 こちらもグラフ。 外部ライブラリもそつなく使いこなしています。 スパークラインも！ アラート。ちょっと飛び出しているのがいい感じです。 アイコン。 ボタン。フラット系で
レスポンシブデザインを制作するなら頭に入れておくべき基本事項7つ | 株式会社LIG
どうも〜こんにちはぁ！ 最近レスポンシブなサイトを作ることが多いライターの、のび太です。 モバイル、タブレットユーザーが最近どんどん増えてきているので、Web制作者にとってレスポンシブなサイトが作れるってことが必須になるんじゃないかなぁ〜って感じますね。 レスポンシブデザインを制作するときに意識しなきゃいけないことはいろいろありますが、今回は「これはぜったいに知っておきたいよね！」って感じた基本的なことを7つご紹介させていただきたいと思います。 レスポンシブデザインを制作するときに意識しておきたい基本項目7つ 1. 画像の代わりになるべくCSSで表現すべし レスポンシブデザインで画像を使うと、モバイル端末ではPCに比べて回線速度が遅いため、読み込み時間が余計にかかってしまいます。 そのため、画像ではなくCSSで表現可能なものはどんどん代替していったほうがいいと思います。 立体ボタンや矢印だ
ECサイトのUXデザイントレンド： 追随すべきもの3つと敬遠すべきもの3つ
最新のeコマース調査で明らかになったのは、商品画像が大きくなり、レビューが充実して、割引が使いやすくなるなど、ショッピングサイトのユーザーエクスペリエンスが改善したということである。しかし、新しいデザインは、商品情報の非表示、サイトからの貧弱なフィードバック、カスタマーサービスエリアの情報過密といった問題も抱えている。 Ecommerce UX: 3 Design Trends to Follow and 3 to Avoid by Amy Schade on January 26, 2014 日本語版2014年3月11日公開 最近、eコマースユーザーエクスペリエンスレポートのシリーズをアップデートしているのだが、デザインの改善が見られることに我々は勇気づけられている。その一方、従来からの問題がまだ残っていることや、新たな問題も出てきていることにはがっかりした。 前回のeコマース調査の結果
デザインの裏側を理解できるエンジニアになろう - Qiita
「画面」のデザインは、エンドユーザーから見た「プロダクト」との唯一の接点。超大事。 そんな画面のデザインにまつわる、エンジニアが「いじる」ときに気をつけると、もしかしたら面倒が減って争いが減ってみんなが幸せになれるんじゃないかなあ、とか、そもそもの設計上で考慮できると、もしかしたら使う人たちが幸せになれるんじゃないかなあ、というポイントを、思い付きで書いていくので、あとは誰か整理してほしい的な投げやり感あふれるアレコレ。デザインとコーディングの話を混ぜて書いてます。 空白の理由を考える編 その1. 空白にまつわる認識の相違 例えば、Tumblrのダッシュボード。右肩のメニューの隅までちゃんとレイアウトされてるなーって感じがします。 でも、もしあなたが「空白を理解しないエンジニア」だった場合、こんな感じにコーディングしてしまうかもしれません。 （※画像はイメージです） 「なーんか、素人感があ
Web開発者に革命をもたらす！「Web Components」超入門 | 株式会社LIG
こんにちは。デザイナーの王です。 Webアプリはデスクトップアプリとは違い、まだまだ発展途上の技術のため、色んな所でまだ未熟な部分があります。デスクトップアプリでは当たり前のことでもWebアプリではできなかったりすることも多いのです。中でも、UIのコンポーネント化問題が以前から指摘されてきました。 通販サイトにある「購入ボタン」を例に説明すると分かりやすいと思います。 この手のボタンを作るには以下の手続きを要すると考えられます。 外観を整える CSS HTMLマークアップ クリックした際の挙動 JavaScript 何が厄介かというと、「再利用」が難しいというところなんですね。 例えば、同サイトの別のページで同じボタンを使いたい場合、js、CSS、HTMLを再度記述しなければなりません。しかも場合によってはHTMLのマークアップが非常に冗長化していることもある。 「購入ボタン」はあくまで一
最近話題になったイケてるWebサービス・アプリ11選（2013年7月編）
こんにちは。 もうすぐ8月ということで、7月中に話題になったwebサービスやアプリを11個ほどご紹介します。 IFTTT IFTTTとは、Webサービスやアプリのアクションを連携させて一連の処理にしてしまうサービスです。 「もし明日が雨だったらGmailにメールを送る」といったことも可能です。サービスの名称は「If this, then that（これをすれば、あれをする）」を略したもの。たとえばスマートフォンでとった写真を自動的にDropboxにアップロード、ブログへ投稿すると自動的にツイートする設定などなど考えられるレシピは無限大。 自分でレシピを投稿したり、他ユーザーの作成したレシピを見ることもできます。エンジニア思考っぽいのサービスですが、どんどん私生活の一部分としてに入り込んできそうですね。 SUVACO（スバコ） ソーシャル・ホームデザイン・サイトです。 家づくり・インテリアに
ますます高まるデザインの重要性！デザイナーが立ち上げたWebサービスまとめ | Goodpatch Blog
エンジニアが立ち上げた会社と言えば、GoogleやAmazon、Facebookなどが有名ですが、デザイナーが立ち上げた会社と聞いて皆さんはどんな会社を思い浮かべますか？その優れたデザインで話題になったPinterestやPathなどのサービスは、デザイナーが共同創業者として名を連ねており、デザイナーが会社を立ち上げることは珍しくなくなってきました。そこで今回のMEMOPATCHでは、創業者（または共同創業者）がデザイナーのWebサービスを8つ紹介します！ Pinterest https://pinterest.com/ デザイナーEvan Sharpは友人二人とサイドプロジェクトとしてPinterestを作りました。とはいえあくまでサイドプロジェクトであったため、その後Facebookでデザイナーとして働きはじめます。EvanはPinterestが気になっていたものの、当時のPinte
jQueryを使用している良デザインなWebサイトを集めたWebデザインギャラリー・Best jQuery - かちびと.net
jQueryをうまく取り入れた良デザインなWebサイトを収集しているデザインギャラリー・Best jQueryのご紹介。jQueryを使用するWeb制作者さんには、インスピレーション向上だけでなく、コードやUIも参考になるかもですね。 普通にWebデザインギャラリーとしても良さそうですが、jQueryを使用している、という共通点を持っていますのでそちらの面でも参考に出来そうです。 jQueryを利用している良デザインなサイトを収集しています。AWWWARDSで見かけるようなサイトが多い印象です。 以下のようなWebサイトが紹介されています。 Tatchies EVB Nerisson 他にもいろいろ。100サイトほど紹介されています。 Webサイトのコンテンツでのカテゴリ分けしかされていないのでギャラリーの機能としては探すのに少し弱いかもですけど、選択肢の一つとしてはありじゃないかなと思い
Path CEOが断言-Mobileアプリの初期バージョンは必ず失敗する その理由 デザイン会社 ビートラックス: ブログ
“恐らくモバイルアプリの初期バージョンのほとんどはユーザーが集まらずうまくいかないだろう。僕のチームが作ったアプリの1st. バージョンもかなりの大失敗だと認識している。” PathのCEO, Dave Morinはそう語る。 モバイルアプリに於いてリリース直後よりいきなりのヒットを生み出すのは至難の業である。彼によると、ユーザーが心地よく使えるレベルまでにUI/UXをシンプルにデザインするのがとても難しいからである。 “モバイルアプリをシンプルにデザインするには非常に時間がかかる。恐らく多くのデベロッパーが最初は素晴らしいと思ったコンセプトを形にしてリリースをする。そして最初のプランとはほど遠い結果を見て絶望するだろう。その時に考えなければ行けないのは、そこで止めてしまうべきかどうか。 理解してほしいのは、初期バージョンはほぼ確実に失敗するという事。重要なのはその結果を踏まえ、数字だけの
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
人気Webデザインを独学できる至高のWebアプリ8選がヤバイ！ | シェアしたくなる最新のWebサービス・ITニュース情報をチェック！ APPGIGA!!（アプギガ）
http://saeki.me/%E3%81%8A%E5%8B%89%E5%BC%B7/573/
今年気になったハイクオリティなデザインUIキット − 2014 - NxWorld
デザインのトレンドを毎日届けてくれるサイト「Panda」 | ライフハッカー・ジャパン
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
UICloud : WebデザイナーのためのUIエレメント専門のリソースサイト
