実装までにする7つの企画作業 - ゆーすけべー日記
メルマガ「ゆーすけべーラジオ」にてWebサービス/アプリをつくるにあたっての僕なりのエッセイを連載中です。先週は実装前に行う企画作業についてまとめてみたのですが、評判がいいので、折角ですしBlogで公開させていただきます。特に複数名でのものづくりに参考にしてみてください！ 何度か述べている通り、Webサービスにおいて「何を」つくるかは最も重要なことであり、いくら崇高な技術を持っていても「何を」つくるかによって、その技術が生きるか死ぬかが決まってきます。何をつくるかをしっかり決めることにより、実際に本番用のコードを書く実装の段階にも確信が持てますし、リリースした際のフィードバックも活きてくるでしょう。世の中でよく使われているサービスやアプリを見るとアイデアに富んだ今まで無かったと言われるような「何」がしっかりとしたものが多いと思います。 こうしたサービスの企画をつくるに当たっては各自の流儀に
ふつうのformをつかいたい - はまちや２ - ニコニコ超会議2012
こんにちはこんにちは！！ はまちや２ (@Hamachiya2) ブロガー、クラッカー。特技は洗濯、趣味は破壊、苦手なことはプログラミング。 WEB+DB PRESS のお便りコーナー担当。 「はまちちゃん」とかで適当にググってください。 無料で プレミアム機能を 使う方法 見つける時間がありませんでした。 何話そう？ プログラムは苦手だし… セキュリティとか興味ないし… そんなわけで普通のことを話します。 本日のテーマ： 『ふつうのformを使いたい』 <form> 電話番号はハイフン抜きの半角で…（はいはい） フリガナはカナで… (カナで名前を学習してしまうのが嫌だけど…) 郵便番号は前と後ろに分けて… (めんどくさいなぁ…) 住所は全角で… (あーはいはい…) … (できた！) (これで送信、と…) ※エラー：住所を正しく入力してください (え、なんで！？) ※住所は全角で入力してく
CSS3 で新しいボックスレイアウト – VERSIONFIVE
先日、WCAN mini Markup Vol.10がありました。第10回を数える今回は「CSS3＋jQueryを実際に使ってみよう！」というテーマで、WCAN x CSS Nite 2009 SPRINGでの益子さんのセッションを実践し紹介し合おうというものです。 僕が紹介したのは、CSS3のレイアウトに関する新しいプロパティ[1]。新しいプロパティを使うとこれからすごくレイアウト組が楽になるよね！ってことがいいたかったので、説明は他所に任せてサンプルを見ていただいくことでイメージしてもらう形にしています。 なお、今回のサンプルは一部のブラウザのみしか動作しません。オススメはSafariかGoogle Chromeです[2]。 可変レイアウト: 横幅指定に % 、ボーダー幅に px を指定したボックスの場合 サンプルのように、2つのボックスを左右に並べて可変のレイアウトを組みたいときを考
MapReduce Patterns, Algorithms, and Use Cases
In this article I digested a number of MapReduce patterns and algorithms to give a systematic view of the different techniques that can be found on the web or scientific articles. Several practical case studies are also provided. All descriptions and code snippets use the standard Hadoop’s MapReduce model with Mappers, Reduces, Combiners, Partitioners, and sorting. This framework is depicted in th
まりっぺぶろぐ
明確な正解のない事柄が多い中でも、べーぺーにおいてはシンプルに基準の1つとできるものがあると、結構前から思っていたので書いてみます。 ネトゲ関係の人に安易には社名を公開したくないという個人的事情から、ここではべーぺーと呼びます。 べーぺーは「関わる人が誇りをもって豊かに生きる」ために存在しているので、「それが誇りあることかどうか」ということが一番根本的な基準なのではないかと思います。 そこに誇りがあるかどうかの基準もまた人それぞれなので、まずは自分自身がどう思うかから入ってよいのではないでしょうか。 私の場合は以下のようなことを思います。 わざと迷惑や嫌な思いをさせようとすること・当てつけのようなことをするのは「誇りがない」 当てつけのようなことをする選択肢や権利は元々はあるが、この会社においてはNGである 他の人のことを「こいつは誇らしくない人間だ」となじることも「誇りがない」 「誇りが
色彩センスのいらない配色講座～色は理論的に説明できる～ : まりっぺぶろぐ
6/30に BP studyという勉強会で発表した時の資料を今頃掲載します。 しすてむえんじにあ的な方ばかりの勉強会でデザインについて何かしゃべることになったので、なるべく誰にでもわかる話にしようと思って、色の超基礎について話すことにしました。 著作権的にアレな部分を修正したので、発表時の資料とは若干違います。トーン表は、1から作るのは30秒くらいで諦めたので、日本色研さんから拝借したままです。怒られたら本気出す。 私がこれらの色の知識をどう身につけたか について、簡単に3点ほど書きます。ほんとに基礎の基礎なので、知識ってほど大層なものでもないですが。 (1)美大受験用予備校で習った 美大受験用予備校では、一番最初にこういう色の基礎について教えてくれます。色の基礎を教えた上で、講師は生徒に「お前は原色使いすぎ。もっと濁った色を使ってバランス取ることを覚えろ。」という風に指導してきます。 色
kamblr - Bootstrap有害論
Bootstrapを使うと、複雑なCSSを書かなくても、綺麗な見た目のサイトを素早く作れて大変便利。なんだけど、UI的にはあまりよろしくない。はっきり言って、これは有害だ。 Bootstrapではタブやドロップダウンメニュー、モーダルダイアログといったUI要素を簡単に使えてしまうので、ついこれらに頼りすぎたUIになってしまう。これらのUI要素は、小さなウィンドウやモバイル機器のスクリーンといった狭い領域に情報を詰め込むための苦肉の策のようなもので、もし使わなくてすむなら使わない方が良い。タブとかドロップメニューがやたら多いアプリや管理画面ってだいたいゴチャゴチャしてて使いにくいですよね。 使いやすい画面を作るには、情報を取捨選択して、優先順位を考えて、適切な場所に情報を配置することが重要になる。けど、これらのUI要素を使うと好きなだけ情報を詰め込めんでしまえるので、情報の取捨選択をしなくな
「クラウドデザインパターン」をAmazonが公開。システム冗長化、突発的トラフィック対応、動的コンテンツ処理など45種類
Amazonクラウドを使ったシステム設計の際に直面する典型的な問題に対して、解決策を分かりやすく分類、解説した「AWSクラウドデザインパターン」（略称CDP）が公開されました。Facebookページも開設されています。 作成したのはAmazonのスタッフやサードパーティのエンジニアら。 CDPのWebサイトはWikiで作られているため、誰でも新たなデザインパターンなどを追加可能。現在45種類のパターンが登録されており「あと3つ加えると“CDP48”と言えるようになるので、ぜひ追加してください」（玉川氏。JAWS Summit 2012でCDPの公開について説明した際に）と、呼びかけています。 45種類のパターンが9のカテゴリに分類 それぞれのパターンには、名前、解決したい課題、クラウドでの解決方法、実装方法、解説図、メリットと注意点、関連パターン情報などが含まれています。 例えば、サーバの
AWS-CloudDesignPattern CDP2.0候補
AWSクラウドデザインパターンとは？ AWSクラウドデザインパターン (AWS Cloud Design Pattern, 略してCDPと呼ぶ)とは、AWSクラウドを使ったシステムアーキテクチャ設計を行う際に発生する、典型的な問題とそれに対する解決策・設計方法を、分かりやすく分類して、ノウハウとして利用できるように整理したものである。 これまで多くのクラウドアーキテクト達が発見してきた、もしくは編み出しきた設計・運用のノウハウのうち、クラウド上で利用が可能なものをクラウドデザインのパターンという形式で一覧化し、暗黙知から形式知に変換したものであるといえる。 パターンの中には、クラウドでなくても実現できるもの、今まででも実現されていたものも含まれているが、クラウド上でも今まで通りのアーキテクチャが実現でき、かつクラウドを利用する事で、より安価にそしてより容易に実現できるものは、CDPとして収
NoSQL Data Modeling Techniques
NoSQL databases are often compared by various non-functional criteria, such as scalability, performance, and consistency. This aspect of NoSQL is well-studied both in practice and theory because specific non-functional properties are often the main justification for NoSQL usage and fundamental results on distributed systems like the CAP theorem apply well to NoSQL systems. At the same time, NoSQL
意外と知らない？アイコンはWebフォントでつくるとこんなに便利！
Webフォントでアイコンをつくろう！ ゆとりジェネレーションのほんだです。 最近、Webフォントを使用する仕事に多く携わった関係で、 Webフォントを有効活用したものすっごく素敵なマークアップ方法に気づきました。 ずばり、アイコンやちょっとしたイラストをWebフォントで作成する、というものです。 （以下のデモはGoogle Chromeなど、モダンなブラウザ推奨です。） jsdo.it のシンボルフォントを使用する - jsdo.it - share JavaScript, HTML5 and CSS アイコンを作成するだけだと、あまり新鮮さはありませんが、 CSS3時代のいま、これはとっても有効なマークアップ方法となっています。 詳しくは、つづきからどうぞ！ 色をつける フォントなのでCSS「color:」で指定するだけで色をつけられます。 もちろんマウスオーバー時に色を変更するのも、C
画像のアップロードをかっこよく実装する - (ﾟ∀ﾟ)o彡 sasata299's blog
2012年02月16日11:36 Webアプリ 画像のアップロードをかっこよく実装する 久しぶりのブログですこんにちわ！最近は主になめこを栽培しております。 なめこ図鑑46%まできたお (*´ω｀*)— ささたつ(Tatsuya Sasaki) (@sasata299) February 13, 2012 ということで、今回は画像のアップロードをかっこよくやる方法について紹介します。 画像のアップロードというか、アップロードしたいファイルの選択ですかね。Twitterだとこんな感じのカメラ画像があって、それをクリックするとファイル選択画面になるんです。 アップロードしたいファイルの選択って、ふつーに実装するとこんな感じのデザインです。かっこよくない！！ まぁこんな感じですよね。 そうじゃなくて、Twitterみたいな感じで画像をクリックするとシャキーン！とファイル選択画面が出てくる、そうい
トランザクションデータ（とマスターデータ）について思うところ - 急がば回れ、選ぶなら近道
業務系のデータ処理では、大きくはトランザクションとマスターに分かれる。 マスターデータは特に、モデルや制御の方法が何かと面倒くさいので、よく議論になる。「マスターデータの管理の手法」というセミナーまで定期的に普通に開かれることも多い。他方、トランザクションデータ（以下TXデータ）は、普通に受け渡しのデータなので、フラットにダラダラ書いておけばよい、という扱いが大抵になる。そもそもER志向でモデルを設計すると、ほとんどは図面はマスターで占められ、TXデータはやたらなんか大量のフィールドを持つ大きなクラスがあるわいね、という扱いも多い。 あと、設計の観点からいうと、ERベースだとマスター設計が花形になる。まぁわかりやすいし、設計作業がしやすい。マスターは「構造」になり、TXデータは「構造」になりにくい。設計者は「構造」が好きだ。良くできた設計は確かに堅牢で、一定の変化にも追随できる。ある種の「
CSS Button Generator | create CSS buttons without code
.buttonClass { font-size:15px; font-family:Arial; width:140px; height:50px; border-width:1px; color:#fff; border-color:#18ab29; font-weight:bold; border-top-left-radius:28px; border-top-right-radius:28px; border-bottom-left-radius:28px; border-bottom-right-radius:28px; text-shadow: 1px 1px 0px #2f6627; background:#44c767; } .buttonClass:hover { background: #5cbf2a }
“API design for humans” をざっくり日本語にしてみた « blog.udzura.jp
37signals Signal vs. Noise で投稿されたブログ記事、面白そうなので日本語にしてみた。特に許可をとってたりとかしてないし、そんな厳密に原文をなぞってないですけど、まあ緩く。原文を必ずあわせて読みましょう。 37signals でデータを取り扱う仕事の終着点のひとつとして、たくさんのバラバラの API を取り扱うことがある – 私は少なくともこの数か月間で、10以上のサードーパーティ API を利用し、それと同時に我々の持っているすべてのパブリック API と、さらに多様な内向けインターフェースを取り扱ってきた。いくつもの違った言語で書かれたラッパーを利用し、いくつかは自分自身で書いた。こんな私が API の設計 – デザインとドキュメントに関して、利用者として強い意見を持っていたとしてもおかしくはないだろう。 私の経験上、 API のユーザビリティに真に関係する要素
ソシオメディア | 「国立国会図書館サーチ（開発版）」のUIデザインコンセプト
ソシオメディアは、国立国会図書館様が運営する「国立国会図書館サーチ（開発版）」について、2010年1月から2011年3月まで、国会図書館ご担当の皆様・株式会社NTTデータ様とともにUIデザインをさせていただきました。 （事例：「国立国会図書館サーチ（開発版）」のUIデザイン [国立国会図書館様]） 国立国会図書館は多くの文献検索サービスを運営しています。その中でも、この新しい国立国会図書館サーチは特別な位置づけにあると言えます。 国立国会図書館サーチは、国立国会図書館が所蔵する全ての図書、デジタルアーカイブ、レファレンス情報（探し方／調べ方の事例など）、都道府県立図書館、政令指定都市の市立図書館の蔵書を検索（非同期での横断検索）できるほか、書誌属性情報にもとづいた多段階での絞り込み、連想キーワード検索、翻訳表示、書誌同定、外部サービス（各種検索エンジン、ソーシャルサービス、所蔵機関サイト、
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
エンジニアtype 技術者のキャリアを考えるWebマガジン - 転職＠type
layer8.sh
IDEA * IDEA
ウェブデザインのセンスを磨こう、素敵なUIデザインのまとめ