ブックマーク / mixiengineer.hatenablog.com (7)

  • 総行数57,000の巨大CSS群をLessに書き換えた軌跡 - mixi engineer blog

    こんにちは!フロントエンド闇祓いの Kuniwak です。 この投稿はmixiグループ Advent Calendar 2015の20日目の記事です。 今年の9月に、スマートフォン Web ブラウザ版 mixi「mixi Touch」の巨大 CSS を Less (CSS プリプロセッサー)でビルドする環境へと移行しました。 書き換えた CSS の行数は、なんと 56,725行 です。😵 ということで、今回は弊社の大規模 CSS → Less 移行事例についてお話しします。 背景 スマートフォン版 mixi は、2010年5月に始まりました。 この頃のスマートフォンは、iPhone 端末であれば iPhone 3GS、Android 端末であれば Nexus One という時期です。 また、スマートフォンの世界では、Webkit ベースのブラウザーが席巻していた時代ということになります。

    総行数57,000の巨大CSS群をLessに書き換えた軌跡 - mixi engineer blog
    kkeisuke
    kkeisuke 2015/12/22
  • ユーザーファーストを実現するmixiの開発プロセス - mixi engineer blog

    デザインユニットUXデザイン担当の酒井です。 mixiでは昨年来、最重要キーワードとして「ユーザーファースト」を掲げ、ユーザー様のご意見やご利用状況に基づいたサービス施策の実現を素早く行えるようになるために、開発プロセスの改善を継続的に行なっています。今回は、この「ユーザーファースト」なmixiを実現するための取り組みについて、具体的にご紹介していきたいと思います。 なぜ今、ユーザーファーストなのか? 昨年11月に開催した『ユーザーファーストウィーク』で笠原社長からもご説明させていただきましたとおり、mixiというサービスが大きく成長したこれまでの数年の間に、いつのまにかユーザー様と私達との間に「ギャップ」が生まれてしまったという強い反省があります。mixiを取り巻く外部環境の変化に対応していく中で、これまでもユーザー様にとっての「心地よいつながり」とは何なのかを真摯に検討し、時流に合わせ

    ユーザーファーストを実現するmixiの開発プロセス - mixi engineer blog
    kkeisuke
    kkeisuke 2015/01/12
  • mixiのアプリの設計がよく分かるブログ - スマートフォン開発研修教材の補足 - mixi Engineers' Blog

    こんにちは。Android の横幕です。Android が好きすぎて、来る日も来る日もアプリの実装が頭から離れず、毎日7〜8時間ほど睡眠をとっていますが全く疲れがとれた気がしない今日このごろです。はやく iOS のアプリ開発を覚えたいですが、まだ NSLog の使い方を覚えたばかりです。 さて、先日スマートフォン開発研修教材の公開についてでも触れましたが、Android・iOS のアプリ開発を始める人向けのトレーニング資料を公開しましたところ、以下のブログのような反響をいただきましたので、この場でもって回答をさせていただきたいと思います。 mixiのアプリの設計がよくわからない http://yamitzky.hatenablog.com/entry/2013/06/19/173713 に遷移します 設計思想の基は MVC iOS も Android も、フレームワークとしては MVC

    mixiのアプリの設計がよく分かるブログ - スマートフォン開発研修教材の補足 - mixi Engineers' Blog
    kkeisuke
    kkeisuke 2013/07/05
  • Androidの機種依存問題を吸収するプロジェクトAndroid-Device-Compatibilityを公開したお話 - mixi engineer blog

    こんにちは。Androidユニットで開発とスクラムマスターをしています、横幕です。すっかり寒くなって、朝起きるのが辛い季節になりました。 先日、Android(TM)の様々な機種に依存する問題を吸収するためのライブラリプロジェクトをmixi, IncのGitHubリポジトリで公開しました。 今回は、このライブラリプロジェクトを公開するに至った経緯をお話しようと思います。 様々な種類の端末に対応するために乗り越えてきた困難 現在、Androidを搭載した端末には、多種多様なものがあります。 そして、OSのバージョンごとの違いだけでなく、同じAndroidを搭載していても、端末ごとに微妙に挙動が異なることがあります。 mixi公式クライアントアプリでも、端末ごとに微妙に挙動が異なることで発生する問題にいくつか直面してきました。 特定の端末で、文字が9,000文字までしか入力できない EditT

    Androidの機種依存問題を吸収するプロジェクトAndroid-Device-Compatibilityを公開したお話 - mixi engineer blog
    kkeisuke
    kkeisuke 2013/01/23
    標準カメラで写真を撮影した後の、保存したデータの取得方法が端末ごとに異なる
  • iOSのMobile Safari上でのfocus()が妙な件を調べてみた - mixi engineer blog

    こんにちは。ミクシィUX統括部にて、mixi Touchの開発を担当しております戸高です。 JavaScriptでの開発を行う事が多いのですが、iOSのブラウザ(Mobile Safari)のfocusの挙動について少しクセがあり、 調べてみましたので、お知らせいたします。 通常、<textarea>や<input type=”text”>等のフォーム要素に対して、フォーカスを与えたい場合、focus()メソッドを使用します。 iOSのブラウザ(以下、Mobile Safari)にて、以下のコードを実行してみます。 (分かりやすい様にjQueryを使用させて頂きました) なお、検証端末にはiPhone4S iOS5.0(9A334)を使用しています。 HTML <!DOCTYPE html> <html> <head> <meta http-equiv=”Content-Type” con

    iOSのMobile Safari上でのfocus()が妙な件を調べてみた - mixi engineer blog
    kkeisuke
    kkeisuke 2012/03/12
  • Sinon.JS を使った JavaScript のテスト - mixi engineer blog

    初めましてこんにちは。ソーシャルクライアント開発の tanabe と申します。 今回は?Sinon.JS を使った JavaScript のテスト方法を紹介したいと思います。 Sinon.JS って何? Sinon.JS はノルウェーのエンジニア Christian Johansen さんが書かれた、JavaScript 用のライブラリです。スタブやモック、フェイクオブジェクトの提供に特化していて、QUnit などのテスト用のフレームワークや実行環境に依存しない所が特徴です。Christian Johansen さんは?Test-Driven JavaScript Development の著者でもあり、こちらは近々翻訳版 が登場するようです。 では早速、Sinon.JS を使ったテスト手法をご紹介していきたいと思います。稿ではテストフレームワークは QUnit を採用しています。 時間

    Sinon.JS を使った JavaScript のテスト - mixi engineer blog
    kkeisuke
    kkeisuke 2011/11/17
  • かんたんCMS 「Tokyo Promenade」を使おう - mixi engineer blog

    先日、待望の長女が誕生したmikioです。あまりにかわいいから育児ブログでもつけようという魂胆ではありませんが、今回は自作のCMSであるTokyo Promenadeについて語ります。 Tokyo Promenadeとは 以前の記事で、Tokyo Cabinet(TC)を使ったCMSを作ることを予告しましたが、Tokyo Promenade(TP)がまさにそれです。TCのテーブルデータベースを使って記事を管理する軽量なコンテンツ管理システム(CMS)の実装です。例によってC言語のみで記述され、libc以外の全実装が "made by mikio" な製品です。 読み方は「東京プロムナード」です。プロムナードとは散歩道のことですが、東京メトロの広告に出てくる宮崎あおい的なキャラが写真付きブログを書いちゃうようなユースケースをイメージして名づけました。まあ実装はそんな洒落た感じとはほど遠いです

    かんたんCMS 「Tokyo Promenade」を使おう - mixi engineer blog
    kkeisuke
    kkeisuke 2009/08/14
  • 1