タグ

ブックマーク / fladdict.net (29)

  • ディープラーニングに頼らず、機械に絵を描かせる | fladdict

    Processingで、自動絵画化してみるテクニカルスタディ。 最近だと、ディープラーニング系でやるのが流行りだけど、あえて手動アルゴで頑張るなど。流行に逆らって、素手で戦うのが美学だと思う!! ファーストのスタディ。アインシュタイン。ドットをボコボコ置いただけともいう。いちおう画素の標準偏差などをとって、絵としての粗密を判定しながらドットを置いていく。 基礎理論ができたところで、ブラシのスタディ。とりあえずランダムな文字で配置してみた。もっとtypographyっぽくなるはずが思った通りにいかない。 セカンドのスタディ。モナ・リザの再絵画化。文字のかわりに筆パターンをテクスチャとして利用。細部がなかなかでない。 キツネの絵画化・・・筆テクスチャの大きさを絵の密度で制御する。色のゆらぎをRGBで表現すると虹色に歪む。 カラーをHSB空間に変更。だいぶいいかんじに。エッジ境界がガラスエフェク

    ディープラーニングに頼らず、機械に絵を描かせる | fladdict
  • スマート家電が実現する素敵なディス☆トピア | fladdict

    スマート家電とIoT(インターネット・オブ・シングス)について、仕事相談がくるようになり色々と基礎リサーチをした。しかしながら家電メーカーが好き勝手にやるとディストピアが到来する・・・という脳内シミュレーション結果が出た。以下はストーリー仕立てでまとめたプレゼン資料。 こんな未来は嫌なので、是非ともこの危機を回避していただきたく。解決編はまた別の機会に書く(あるいはクライアントにだけ提案する)。 fladdictさんの新居事情 fladdictさん(仮)は、UIUX系の会社に勤務するギリギリ富裕層のデザイナー。念願のマンション購入にあたり、�家をまとめてスマート家電�化することにした。 意識高い系であるfladdictさんは、未来の生活を調査すべく自ら人柱となったのである! 新居は、大手建設会社と大手家電メーカーが共同開発したスマートマンション「スマートピア南平台」。具体的に何がスマート

    スマート家電が実現する素敵なディス☆トピア | fladdict
  • よくわかるマテリアルデザインの設計コンセプト | fladdict

    iPhoneAndroidではiPhoneのほうが良くできているが、iOSのフラットデザインとAndroidのマテリアルデザインでは後者の設計が優れている。マテリアルデザインは、デザインとエンジニアリングが高いレベルで融合していて、ロジカルで非常に美しい。 以下、自分の理解をまとめたメモ。 紙とインク マテリアルデザインは「ペーパー」と「インク」のメタファーでできている。 ペーパーの特徴 バーやボタンといった画面上のUIコンポーネントは、バーチャルな紙でできたカードと考える。また、このペーパーは1dpの厚さを持っている。 ペーパーは純白の矩形、あるいはシンプルな円形である。三角や星型といった複雑な形はとらない。そのような複雑な形状や模様はインクが担当する。 現実とことなり、このペーパーは自由に伸縮することができる。 マテリアルデザインにおけるレイアウトは、複数のペーパーを並べたり、重ねた

    よくわかるマテリアルデザインの設計コンセプト | fladdict
  • 社員がフリーランスになる前に教えておきたいこと | fladdict

    秘密結社THE GUILDも仲間が15人近くになり、僕の直轄チームも3人に増えた今日この頃。直轄チームのみんなには、できれば幹部になって欲しい。でも、翼を折って囲い込むのではなく、いつ独立しても恥ずかしくないように育てていきたい。っていうか、ここに書いたのできるまで、独立なんぞ許さんよ的メモ。新入社員は各自マスターしておくこと。 1: 収入の一定パーセントを貯蓄しなさい 収入の10%〜20%を、お給料日に自動振り込みで貯蓄しなさい。お金持ちになる唯一の方程式は「消費<収入」。この方程式が強制的に維持される仕組みを作る。これが人生を安定させるために一番重要なことです。 2: 生活資金を半年分ためなさい まず無収入状態でも3〜6ヶ月生存できる貯金を作りなさい。生活費の安全バッファは大型案件や、お金にならないチャンス案件を手に入れる最低条件です。安全バッファがなければ、常に生活費のために自分を切

    社員がフリーランスになる前に教えておきたいこと | fladdict
  • スマホUI考(番外編) UIやUXを劇的に改善する、『ビッグオー駆動型開発』とは | fladdict

    いま『ビッグオー駆動型開発』とよばれる開発手法が、業界の一部で注目を集めている。 その理由は非常にシンプルだ。『ビッグオー』は非常に安価で簡単な手法でありながら、従来の開発手法に比べ劇的にUIUXを改善できるためである。 製品コンセプトのような上流から、ボタンのレイアウトといった下流工程、さらにはグロースハックやプロモといったリリース後のフェイズまで一つの手法でユーザビリティを評価できる。この汎用性がビッグオー駆動開発の大きな特徴であり、導入時の利点となる。 今回はこのビッグオー、の概要と具体的なやり方について論じたい。TwitterUI拡張予言以来、久しぶりのUI系エントリである。 ビッグオー駆動開発とは何か? ビッグオー駆動開発は、正式には『OKAN Driven Development(オカン駆動型開発)』とよばれる開発手法である。 これは自分のオカンを指標とすることで、低コスト

    field_combat
    field_combat 2014/02/04
    ネタっちゃ、ネタだけど、前職でITリテラシーが極端に低い営業のおじいちゃんをテスターにしたことがしばしばあった
  • スマホUI考(番外編) 顧客やユーザーの要望に全て対応すると、アプリは99%破綻する | fladdict

    顧客や上司、ユーザーの場当たりな要望に対応しつづけると、どんなアプリもゴミアプリになる。たとえそれが理にかなった要望であっても。 なぜなら面積の限られたスマホでは「一画面の機能数とボタン数」が、使い易さと品質に深くリンクしているからです。 ということを、エラい人にプレゼンするのがお仕事の今日この頃。でも毎回毎回、同じことを説明するのがシンドイので資料をブログにまとめたいなぁと思うなど。 思考実験として、ここでは架空事例としてTwitterアプリを例に考えてみる。 何かの間違いで、日の大手メーカーがTwitterを買収すると・・・UIデザイナーが体を張らないと99%ぐらいの確率でこうなるのです。 ここがオリジナル Request1: ダイレクトメッセージをトップ階層に ユーザーからの真っ当な要望。実際にはサービスの質ではないのですが、要望はかなり多いはず。 ただTwitter社的にはme

  • 嘘に嘘を重ねてリアリティを出す | fladdict

    これはアイデアの勝利。 透過スクリーン(ポリッドスクリーン)による初音ミクの空中投影に、さらにプロジェクターを使って嘘の影を投射して同期させるデモ。質量が感じられるバーチャルアバター。 とてもシンプルな思いつきなのだけど、存在しないオブジェクトに影があるだけで、いままでの3Dやホログラムとはまったく違う臨場感が出てる。 ちなみに動画使われている空中投射スクリーンとは、ニコニコ動画技術部が開発した1平方メートル30円の超低コストスクリーン(農業用のポリエチレンフィルムともいう)。 手前の透過スクリーンに初音ミク。背後のペーパースクリーンにミクの動きと同期した影を投射している。2つのまったく異なったプロジェクション表現を使って、1つのオブジェクトにリアリティを与えるというのは面白い。 なんかに応用できそうなのでメモ。 <追記>農業用ポリエチレンシートで、空中投射スクリーンを作るチュートリアル。

  • 一眼レフで超高速撮影をする方法など(多分弾丸も撮れる) | fladdict

    連休中の遊びにハイスピード撮影に挑戦@お風呂。 ヤバイ、すげぇ面白い。 昔からハイスピード撮影やってみたかったのですが、ハイスピードカメラは一千万円クラス。正直諦めてました。水滴ですらシャッタースピードが1/4000〜1/8000秒、弾丸や風船だと数万分の1秒必要なんですよね。 普通の一眼で、f.13のシャッタースピード1/8000以下とか無理ゲーです。 そしてそもそもの話、一眼のシャッターは1/1000秒単位のタイミングで誤差なしで被写体を狙えるほど精度が高くない。 ところが調べてみると、一眼レフで擬似的に限界以上のシャッタースピードを出す方法確立されてたり。世の中には頭のいい人がいるものです。 それはシャッターでなくフラッシュで、ハイスピード撮影するということ。 もうシャッターは開きっぱなしにして、フラッシュを超速で点灯させて写真撮る。 暗闇で長時間露光をしてフラッシュを1/20000

  • iTunes11のアルバム情報表示に使われるオシャレアルゴリズムを考える | fladdict

    iTunes11がリリースされましたね。賛否両論を呼びそうな大変更。 このiTunes11、アルバム選択時の情報画面がもの凄く凝ってる。なんとアルバムジャケットにあわせて情報の色が変化するんよ!! 何これオシャレ! どういうアルゴリズムになっているのか、とっても気になる。 仮定としては、 ジャケットを16〜32色程度で減色、パレット抽出する。 四辺のエッジに含まれる色から、最多ピクセル色を背景に採用。 残りの色の中で、背景色と一定距離(RGB or 色相)がある最多ピクセル色を文字色1として採用。 残りの色の中で、背景色と一定距離(RGB or 色相)がある最多ピクセル色を文字色2として採用。 どうしても適切な色がない場合、白か黒を文字色に採用。 アルバムの四隅に対し、背景色でインナーシャドーをかける という感じかなと。多分これであってる。 アルゴリズムで文脈にあった綺麗な配色を作るってい

  • どんなに頑張っても、出版社は電子書籍の価格を防衛できない | fladdict

    Kindleストアを見て思った。無理だ。 3〜5年のタームで見た場合、出版社がどんなに足並みをそろえて防衛線を貼っても、電子書籍の価格を維持することは難しい。 なぜならば電子書籍ストアにおいて、最大のライバルは同業者ではないからだ。 電子書籍の最大の特徴は、「印刷、複製のコストが0になったこと」だ。これは参入障壁の劇的な低下と同義であり、3種類の危険な新規プレイヤーを呼び寄せる。 新しいプレイヤーの参入 出版のコストが限りなく0に近づく時、新たに参入してくるプレイヤーとは誰か? では、その新規プレイヤーは何なのか? まず第一に「ギャンブルのできる、失うもののないプレイヤー」、そして第二に「金銭的な利益を求めないをプレイヤー」、そして第三の、最大の競合が「書籍以外に収益モデルのあるプレイヤー」の参入である。 第一の「失うもののないプレイヤー」とは、いわゆるインディペンデントや新規参入の出版社

  • Skala Previewは、iPhoneアプリ製作に必須かもしれない | fladdict

    有名アプリなんでしょうかね、Skala Preview。いままで知りませんでした。 Skala Previewを使うと、Mac上の画像やPhotoshop画面やクリップボードの画像を、iPhone上でピクセルパーフェクトで表示できます。 Mac / iPhone 用アプリ。 使い方も簡単で、MaciPhoneで両方立ち上げれば適当に同期してくれます。フォトショッパ—マジ感涙! 昔はイラレ画像をDropboxとかメールで転送してたのですが、Skalaを使えば直接見れる。UIもシンプルで綺麗。まだiPhone5には対応してませんが、はやく対応して欲しいなぁ。これは便利! ついでに、普段使ってるものをつらつら。大分定番ですが。 IconKit Store 大きいアイコンを作れば、自動でiPad用やiPhone用などすべてのアイコンをリサイズして準備してくれる。 ReSizer Store iP

  • HTMLをレイヤー別けしたPSDに変換するキャプチャーソフト Page Layers が神 | fladdict

    Page Layersは、すごいウェブのキャプチャアプリ。なんとキャプチャするサイトを、DIVやIMG要素ごとにレイヤー分割したPSDにしてくれるのだ! これは素敵と言わざるをえない。 ビデオをみれば使い方は一目瞭然。URLを入力して保存ボタンを押すだけで、なんでも構造化したPSDにしてくれる。 Mac専用アプリで、AppStoreで$28.99。これは買いだと思います。 Web関係者は必須的な。

    field_combat
    field_combat 2012/09/17
    マジか。
  • Amazon流の開発術では、まずプレスリリースを作る | fladdict

    Amazonでは製品開発をするとき、まず最初にプレスリリースを書くらしい。これは”Working-Backwards“と言うデザイン手法。面白げなので色々と調べてみた。 Working-Backwards法の商品開発では、お客様の視点をスタート地点にするため、開発前にプレスリリースを作成する。プレス内容は、既存プロダクトの問題点と、それを新製品がどう解決するかが中心になる。 プレスがユーザーに響かなかった時点でプロジェクトはボツ。そもそもその商品は作らない。これにより見当違いな商品を作るリスクを、一番最初の段階で低コストに回避できる。 このWorking-Backwards法で書くプレス内容は主に以下のとおり。 見出し 顧客が商品を理解できるタイトル 副題 ターゲット層と、彼らのメリットを1行で。 概要 商品の特徴と利点をまとめる。この段落で全てを理解できるように。 課題 このプロダクトが

    field_combat
    field_combat 2012/08/10
    お客さんが目にする順序で企画を進めるって感じ?
  • fladdict » スマホのUI考 〜 ボタンについて

    SuperPopCamとか作ったときに、体系的な資料欲しいなぁーとか思ってたことのまとめ。 色々と自分の中の考えをまとめるためのメモ。世の中のアプリは機能を半分にして、減った予算分をUIの練り込みにつぎ込んだ方が絶対よいアプリになると思う。 書いてる作業が一番考えまとまるので、ちょぼちょぼあげていこうかと、まずはボタンから。 指の大きさの制約を受ける ・Webとスマホを比較した場合、最大の違い。 ・ピクセル単位でクリック位置を制御できるマウスポインタと違い、指は大雑把にしかタップ位置を指定できない。 ・このためAppleはボタンの最小サイズとして44pxというガイドラインを作っている。 ・視覚的に44px以下のボタンも実際のヒットエリアは大きめにする。 ・またこれに留まらず、ボタンとボタンの間のマージンは空けられるだけ空けた方が安全。 ・つまるところ「カッチリ」つめたボタンレイアウトのグラ

  • 仕事でtwitter使う人には、Bufferというサービスは必須かもしれない | fladdict

    百式の田口さんに教えていただいた、Bufferというサービスがとても便利。最近ヘビーユースです。 Bufferは呟きをTwitterやFacebookに、時間を分散して投稿してくれるサービス。朝おきて、気になった記事をブックマークレットで適当に登録しておけば、いい感じにばらけてTweetをしてくれるのです。僕はミーティング参加中なのに、2chブログを勝手につぶやいてくれたりとか。 iPhoneアプリもあるし、Chrome拡張もあって、拡張をいれるとTwitter家のページにもBufferボタンがついたりとか細かいところも便利。特にクローム版のインストールをお勧めします。 お仕事Twitter使う人は、Bufferに色々つっこんどけば寝てても、他の仕事しててもいい感じに運営されるのでとっても便利かもしれません。 締め切りなのに僕が呑気に呟いていたら、全部バッファーのせいです、僕が遊んでる

  • まったく未知の読書体験をしてみよう | fladdict

    最近になって気がついた読書方法。いちどやると世界が変わる。 耳栓をする。 新しいiPad小説PDFを入れる。 部屋を真っ暗にする。 PDFの表示を白黒反転する(そういう機能のあるPDFアプリを使うか。iPhoneの弱視モードでもできる)。 真っ暗な空間の中に超高精細な白い文字だけが浮かんでいる、そんな未知の読書体験がはじまるよ!。 なにこれ、ものすごい没入感!! <追記> 弱視モードのやり方。iPadの「設定アプリ」を開く、一般→アクセシビリティ(下のほう)→「黒字に白」

  • Facebookでのプロモーションを左右する8つの成功要素 | fladdict

    BuddyMediaというfacebookのソーシャルマーケ会社のだしたリポート、「Strategies For Effective Facebook Wall Posts: A Statistical Review(効果的なFacebookウォール投稿為の戦略:統計的レビュー)」が興味深かったので抜粋。 題名の通り、Facebookに広告ポストをする場合、投稿のどのような要素がどれだけトラフィックに影響を与えるかを統計的にまとめたレポート。 マジオモロいので要約。いつものごとく厳密なデータは原文をあたること。 1:短い文章ほど効果が高い 統計的には長いツブヤキほど不利になる。 80文字以下の投稿は全体の19%にすぎないが、訴求効果は27%増。 2:短縮URLは控える 通常のURLは短縮URLと比べて、訴求効果が3倍も高い。 これは短縮URLの文字列はリンク先を示唆できない為。ブランド訴求

  • 思わず全部読んでしまった、面白いWeb漫画10個

    引っ越しに伴い、蔵書を数百冊捨てたので読むがない。そんなわけで、最近は野生のweb漫画ばっかり読んでいます。 web漫画超面白いっす。思わず全部読んでしまった面白作品を徒然なるままにメモ。オススメ度は順不同。どれも下手な週刊誌の漫画よりオモロいです。 1: 7と嘘吐きオンライン まずは取っ付きやすくTwitterをテーマとした短編漫画。ありそうでなさそうな、Twitter的コミュニケーショん。前編、後編。(なんで、同作者の「堀さんと宮村君」が紹介されてない!?という声を多数いただきましたが、それは僕が今リアルタイムに読んでいてまだ読了できてないからです。今編が終わって番外編に突入したところ)。 2: 漫画で分かる診療内科 信頼と安心のギャグ漫画。もはや説明はいりません。ブラックな冗句を交えつつ、精神医学を語ります。これ当に病院サイトの公式コンテンツなんですよ。。。全12話くらいで更新

    field_combat
    field_combat 2010/10/20
    そういえばWebマンガって読んだ事ない
  • Flashにおけるマルチタッチ実装について | fladdict

    iPhoneを色々触ってQuadCameraに、自力で回転つきUIScrollViewとかを実装したりしたお陰で、ようやっとFlashでマルチタッチを実装するノウハウとかが確立できた気がする。 Flashでマルチタッチはサイネージ系でもほぼ仕事がなさそうだけど、先行投資研究としてメモ。 数年後には需要がでるはず。 ■マルチタッチを如何に管理するか ゆび1つにつき1つのTouchObjectとして管理し、TOUCH_PRESS, TOUCH_RELESE, TOUCH_MOVE をEventDispacherで発行するようにする。 要はこのパートはiPhoneの機構をマルパクリする。 ■タッチの同一性の検出 最大の問題は、指Aのタッチと指Bのタッチの同一性を検出すること。 つまりマルチタッチでグリグリ動かすときに、2つのタッチでどっちがAでBかを正しく判別しつづけること。 iPhoneではコ

  • FITC 3日目 ScaleForm GFxがヤバイ件 | fladdict

    FITCで唯一、複数セッションを持ってるGSkinner先生。 ちなみに僕の脳内Flashコーダーヒエラルキーでは、GSkinner, Quasimondo, Bit101, Andre Michelleが四強。 そのGSkinnerが発表したのが、彼の最新プロジェクトScaleForm GFX。WebのFlash屋の間ではあまり知られていない、フレームワークだけどこれが滅茶苦茶凄い。 コンソールゲーム機ソフトのUI、オープニング、エフェクト等をFlashで作ってそのまま、インポートできるようにするミドルウェァ。 対応ハードはWii、PS3、Xbox360、PSP、PS2等。 ScaleForm GFxを使えば、ゲームのコア部分以外の大半はFlashとAS2で開発できるようになるらしい。 ゲーム内で使われるテクスチャ等にFlashを用いることも可能らしい。 PS3のナルトの格ゲーなんかは、

    field_combat
    field_combat 2009/05/01
    FlashでゲームのUIとか作成できるらしい。MassEffectとか今時のゲームで使われてるらしい