サクサク読めて、アプリ限定の機能も多数！
トップへ戻る
ドラクエ3
nanameue.jp
Our missionつながりを、科学する。 人と人との出会いのカタチは広がっている一方で、 心が通じ合う人とつながることは、まだまだ難しいものです。 私たちは、より良い人間関係をアルゴリズムによって科学し、 「出会うべき人に出会える機会」を届けていきます。 性別も、年齢も、住む場所も飛びこえた、 本当に気の合うつながりを。 ありのままの自分をさらけ出して、 尊重しあえるつながりを。 普通に生きていては出会うことのないような ナナメウエのつながりを、ひとつでも多く。
Products, Our JourneyHow we change the world
ご無沙汰しております。瀧嶋です。 さて、見返せば5ヶ月ぶりの更新です。不本意です。誠に不本意でございます。 5ヶ月と言うと本当にいろいろなことがあったのですが、その話は飲みの席にでも譲るとしましょう。 本日はニューリリースのお知らせでございます。 長らく開発を続けてきたアプリをリリースしました！ 32秒間のスライドショー動画を手軽に作れるSlideStoryというアプリです。 SlideStory – 32秒でつくる記憶の物語。 1.0（無料） カテゴリ: 写真／ビデオ, ライフスタイル 販売元: nanameue, Inc. – nanameue, Inc.（サイズ: 33.5 MB） 全てのバージョンの評価: （11件の評価） その名もSlideStory iPhoneで写真を撮る機会はたくさんあると思います。友達と遊んでいるとき、イベントに行ったとき、デートをしているとき、、
こんにちは。たきしま(@zeroro713)だよ。 今さら感Maxですが、一応書いておきます。 今回はiOS6からのUITableViewの背景指定方法です。 iOS6でgroupTableViewBackgroundColorを設定する | ナナメウエBlog 上記記事に関連しての話題なのですが、iOS6からUITableView(grouped)の背景が変わらないという現象に悩まされた方もいるかと思います。 今までは、こんな感じのコードを書いていたかと思いますが、 UITableView *tableView = [[UITableView alloc] initWithFrame:self.view.bounds style:UITableViewStyleGrouped]; tableView.backgroundColor = [UIColor blueColor]; //
「Illustrator Mania」というサイトを作り、3月中旬頃より正式にオープンさせました。 Illustrator Mania なにそれ？美味いの？ 私、鈴木（@suzukisan__）がIllustratorについていろいろと書いています。 Illustratorというのは非常に素晴らしいアプリーケーションですが、ひとつひとつの機能について完全に理解しているわけではありません。 そこで自分自信の勉強を含め各機能についての解説や、効果について検証し、その内容をまとめています。 まだすべての機能について書けていませんが、メニューから使用できる機能について徐々にまとめています。 機能説明 また、その基本機能を元にTipsやチュートリアルなどの記事も書いています。 記事中で使用されている機能については可能な限りリンクを貼っているので、具体的な使いどころなどもわかるかと思います
「InstaMusic」はiPhoneで聴いている音楽の情報を写真に追加し、まるでCDジャケットのような美しい写真を簡単に撮影・共有できるアプリです。 もちろんInstagram風のフィルタ加工をすることもできます。 Twitterで#nowplayingのハッシュタグでつぶやく時など、今聴いている音楽の雰囲気に合った画像も一緒に投稿してみてはどうでしょうか？ InstaMusic – この景色とあの曲を一緒に。 InstaMusic – Great Photo and Music! カテゴリ: ソーシャルネットワーキング 価格: 無料 使い方 すでに音楽を聴いている場合はその情報が表示、音楽を聴いていない場合には右上の「音楽選択」ボタンから好きな音楽を選択します。 撮影画面を見ながらフレームを選択することができます。 フレームによってテキストの位置、色、フォントなどが違うので
生きてます。ナナメウエのはっちです。 お仕事で、mp4の動画からサムネイル（アニメーションGIF）を生成したいんだけどという場面に遭遇しました。 色々調べたところ、Webアプリでもあるっぽいのですが、そのアプリを試したところ正常に動いておらず、ぐぬぬ…どうしようかな、と。 そういえば？Photoshopで動画編集ができるという噂を以前聞いたことがあったので調べてみました。 意外とまだ需要のあるアニメーションGIF。 お役に立てれば幸いです。 Photoshopでmp4動画を開く 使用しているのはPhotoshopCS5です。 どのバージョンから動画が取り込めるのかは知りません。だってわたしFireworks派だもの…！ ファイルから「開く」でもいけます。今回はドラッグ＆ドロップで。 タイムラインを表示 読み込みに少々時間がかかりますが気になるような時間でもありません。 とりこま
最近一気に暖かくなって一気に春を感じるようになりました。 今週末や来週末にお花見に行こうと考えてる人は多いのではないでしょうか？ そこでお花見に役立つアプリを紹介します。 るるぶお花見特集2013 現在地や地域を選択してお花見スポットや、開花の時期などの情報を知る事ができます。 るるぶお花見特集2013 カテゴリ: 旅行 価格: 無料 WalkerTouch 地域、現在地、名所、桜祭りなど様々な条件で検索することができます。 スポットの詳細ページではライトアップなどの情報も掲載されているので、夜のお花見も安心ですね。 WalkerTouch（ウォーカータッチ） お出かけ＆エンタメ情報 カテゴリ: ナビゲーション 価格: 無料 花見でかまちょ 地域別でお花見スポットを探すことができます。 ついでにお花見に行くっていう名目で、一緒に行く人も探せるらしいですよ（震え声 花見でかまちょ
iOSのアプリを作った際に、ブログやSNSでのマーケティングはもちろんのこと、広告などを使う場合にもランディングページは欠かせないものです。 また、ユーザーがまだアプリを使う前にランディングページ内でUIや、使い方について紹介することにより、ユーザーが実際にアプリをダウンロードして使う時の予習にもなります。 そのアプリについて少しでも知っているだけで迷うことが減少し、離脱率も下がります。 3do 3do – The next generation of reminder apps カテゴリ: 仕事効率化 価格: 無料 Analytiks Analytiks – Google Analytics app カテゴリ: 仕事効率化 価格: ￥250 BREAKS Breaks カテゴリ: 天気 価格: ￥250 COCKTAILS The Cocktail App カテゴリ
ちょっと古いかもしれませんが、地面に反射しているようなこの文字。 実はillustratorのアピアランス機能を使うことで簡単に作成することができます。 全てアピアランスで設定しているので、文字数が変化した場合にも簡単に修正することができます。 まずは適当なテキストを入力します。 次にアピアランスパネルで、塗りを2枚追加します。 今回は#333333の塗りを2枚追加しました。 最終的に下の塗りは色を変更するのでなんでもいいのですが、とりあえず同じ塗りを追加しておきます。 アピアランスパネルの下の塗り選んで、[効果] → [パスの変形] → [変形]を選択します。 拡大縮小の[垂直方向：49%]、移動の[垂直方向：27px]、オプションの[水平軸にリフレクト]にチェックを入れます。 この値は最初に入力したテキストのサイズによって変わるので、適当に調節しながら下の画像のようになるよ
iOSのアイコンを実機確認する時の必須アプリでもあり、以前ブログでも紹介したiconsiderがアップデートしました。 より使いやすくなり、気のせいかもしれませんがDropboxとの同期も早くなった気もします。 さらに今回のアップデートで私が作成したアイコンも一部掲載して頂きました。 開発者の@dvw_inside様ありがとうございます。 iconsider アイコンデザイン実機シミュレーター カテゴリ: 仕事効率化 価格: ￥250 iOSデザイナーにオススメ！ 「iconsider」というアプリが便利すぎる！ | ナナメウエblog 今回のアップデート内容 iOS6/iPhone5対応 バグフィックス 新デザイン追加 ついにiPhone5のディスプレイサイズに対応。 これは嬉しいアップデートですね！ 使い方 アプリを起動すると、iOSのホーム画面が現れます。 ホームアイ
ご存知の通り、IllustratorにはPhotoshopに搭載されているシャドウ（内側）のような効果はありません。 近いものでいうと[スタイライズ] → [光彩（内側）]を使う方法なのですが、これだと境界線全体から内側にシャドウが適用されてしまいます。 テキストをアウトライン化 → 元の位置にコピー → 元のオブジェクトから少しずらして前面オブジェクトで切り抜き → ぼかし（ガウス） → クリッピングマスクという方法もあるのですが、けっこう面倒です。 普通のオブジェクトであればこの方法でもいいのですが、テキストなどの部分で修正があるとさすがにもう一度同じ行程をおこなうのは大変ですね。 そこで今回はアピアランスを使って、擬似的にこれに近いものを作成します。 まずはアピアランスに塗りを2枚追加します。 下の塗りは後で変更しますが、この段階では同じ色で大丈夫です。 今回は#808080を
illustratorでグランジ加工をする方法です。 線をチョークや木炭などに設定して上から重ねるという方法が最もポピュラーですので、ちょっと珍しい方法をご紹介します。 一回作っておくと使い回しが効くので便利かと思います。 まずは長方形ツール（ショートカットはM）を使い、適当な四角形を描きます。 わかりやすいように色は黒にしています。 続いてナイフツールで四角形オブジェクトを切っていきます。 もうメチャクチャに切りまくります。 上下左右に切り分けて、細かくしてあげます。 切り終わったら、オブジェクト全体を選択した状態で[オブジェクト] → [変形] → [個別に変形]（ショートカットは⌘+Shift+Option+D） 「水平方向：5%」「垂直方向：5%」「水平方向：100px」「垂直方向：100px」、オプションは「垂直軸にリフレクト」「水平軸にリフレクト」「ランダム」「オブジ
いろいろなサイトでまとめて頂いたKenstagram、この度アップデートをしました。 これにより、今まで20体（+鈴木）だったケンタウロスが35体（+鈴木）になりました。 Kenstagram – ケンタウロスと一緒に写真が取れるカメラ カテゴリ: ソーシャルネットワーキング 価格: 無料 アップデートした経緯 アップデートを遂行した理由としては、終電を無くして家に帰る途中に、道端に倒れている野良ケンタウロスを発見したことが発端です。 当初は衰弱していた彼ですが、弊社メンバーによる必死の介護により今では風よりも早く走る程に回復。 新たな彼の姿を是非、多くの皆様にご覧頂ければと思います。 （※今回のケンタウロスは少しシャイなため15枚ほどしか写真が集まりませんでした。ご了承ください。） ちなみにKenstagramのアイコンのレンズにはケンタウロスが写り込んでいるので気が向いた人
ご存知の通り、illustratorにはヒストリー機能がありません。 ラスタライズしたり、アピアランスの分割をしない限り、大部分の機能は再編集が可能なのですが、複雑な図形でパスファインダーをミスるとけっこう辛いものです。 アートボードの外に編集前のオブジェクトをコピーしておくのもひとつの手段なのですが、それとは別の方法を紹介します。 複合シェイプにする optionキーを押しながらパスファインダーの効果を選ぶことで複合シェイプにすることができます。 この状態ではオブジェクトをダブルクリックするか、ダイレクト選択ツールなどを使うことでオブジェクトの編集が可能になります。 その後、複合パスを統合したい時には[拡張]をクリックすることで複合シェイプが解除され、適用後のオブジェクトのみが残ります。 *複合シェイプへの適用が可能なのは、パスファインダーパネルの「形状モード」にある4つの効果のみ
先日、こちらの記事で角丸について詳しくまとめられていました。 その中で「角丸は中心にいくほど小さくなる」と書かれていたので、illustratorで扱う際の注意点をまとめました。 デザイン時に注意したい角丸の使いかた | Design Color illustratorで角丸を表現する方法 [効果] → [スタイライズ] → [角を丸くする]です。 ショートカットは⌘+Shit+Rに設定しています。 ちなみにiOSのアイコンでは114pxで角丸半径20px、512pxで90px、1024pxで180pxですので、アイコンのサイズと一辺の角丸の比率は17%って覚えとくといいかもです。 Photoshop効果を使った場合の角丸 左は角丸に粒状フィルムを適用したもの、右は粒状フィルムを適用した後にマスクをかけたものの拡大図です。 粒状フィルムなどのPhotoshop効果を適用した場合
普段よく使う粒状フィルムについて軽く研究したので、その内容などを… 粒状フィルムとは [効果] → [アーティスティック] → [粒状フィルム] パラメータは「粒子」「領域のハイライト」「密度」があります。 名前の通り、粒子を生成してくれる効果です。 かなり万能なテクスチャとして使うことができます。 少しざらっとしたような質感から、メタリックな質感、簡単な芝生なども粒状フィルムで作成できます。 粒子パラメータ こちらは薄いグレー#e6e6e6(R230 G230 B230)のオブジェクトに、粒状フィルムを適用したものです。 左から順に「粒子」パラメータの値を1ずつ増加させていき、一番左が値10のものです。（最大値は20） 「粒子」パラメータ1のオブジェクトを6400%に拡大したものです。 細かい1pxが色を変えてランダムで並んでいます。 同じく「粒子」パラメータ10のオブジェクト
Instagram風の素敵な写真に突如ケンタウロスが自動的に挿入されてぶち壊すという、ゲスいカメラアプリを作りました。 写真を撮影、またはカメラロールに保存されている画像を選択し、フィルターを選ぶと勝手にケンタウロスが映り込みます。 現時点で約20種類のケンタウロスと戯れることができます。 Kenstagram – ケンタウロスと一緒に写真が取れるカメラ カテゴリ: ソーシャルネットワーキング 価格: 無料 使い方 アプリを起動するとすぐにカメラが起動します。 「Fx」ボタンを押すことでフィルターを確認しながら撮影することができます。 *この時点でケンタウロスはいません。 フィルターを再度、選択することができます。 自分の好みのフィルターが決まったら先に進みましょう。 *この時点でもケンタウロスはいません。 本家のInstagramをはじめとした様々なSNSに送ることができ
使用ツール まずillustratorでシャドウを表現できるのがこちらの9個のツール。 （*SVGフィルターの使用方法については使用した経験が無いため触れていません。） CS6を参考にしたものですので、バージョンによって微妙に使い方が異なる場合や存在しない機能もあるかもしれません。 ドロップシャドウ 光彩（内側） 光彩（外側） ぼかし（ガウス） ぼかし グラデーション グラデーションメッシュ ブレンドツール 不透明マスク ドロップシャドウ [効果] → [スタイライズ] → [ドロップシャドウ] ショートカットは⌘+Shift+Dに設定しています。 もっとも頻繁に使うシャドウのひとつです。 値指定の「ぼかし」はぼかし（ガウス）と同じで、元のオブジェクトの形に対してドロップシャドウが適用されます。 ドロップシャドウはひとつのオブジェクトに対して何重にも適用することができますが、2回
こんにちは、いつかiOSのデザインのみで食べていきたい鈴木(@suzukisan__)です。 まだまだ若輩ですがiOSのデザイン環境について紹介させて頂きます。 画面設計 iPhone Idea Sheet あまり紙でやることはないのですが、使う場合はこちらのiPhone Idea Sheetです。 うちではむしろエンジニアさんのほうが使っています。 三階ラボ | iPhone Idea Sheet ver.01 あまりに使いやすいのでiPhone5用にiPhone5 Idea Sheetなるものをうちで作成しました。 iPhone5のワイヤーフレームに使えるアイデアシートをイラレで作りました | ナナメウエblog POP 本来は紙に書いたワイヤーフレームから画面設計をイメージするためのものだと思いますが、普通にデザインだけしてコーディング前の画像を取り込んで画面推移を説明す
iOSのデザインをやる時に一番大変なのが実機確認だと思います。 特にアイコンは実際にホーム画面に置いてみて、周りの他のアプリのアイコンに埋もれていないかなどを何度も検証します。 今まではiPhoneのホーム画面のスクリーンショットを撮って、その正確な位置に配置して画像として書き出したものをiPhoneに送信 → 確認という方法を使っていました。 一度ホーム画面のレイアウトを作ってしまうと難しくはないのですが、どうしてもiPhoneに送る手間がネックでした。 今回はそれを解消してくれる「iconsider」というアプリを発見したのでご紹介します。 こちらのアプリは、自分のDropboxにアイコン画像を入れるだけで自動的にiPhoneで確認することができるとても便利なもので、iOSデザイナーには必須になるんじゃないかと思います。 iconsider アイコンデザイン実機シミュレーター
おはようございます。 気づいたらもう2月ですね。 今年も残り11ヶ月、心の底からillustratorを愛していきたいと思いますよろしくお願いします。 それではillustratorで木の質感を表現する方法を紹介します。 illustratorでの木の質感表現はいくつかあるのですが、今回は最も簡単な方法を紹介します。 今回の場合は木の木目が黒くなるので、濃いめのフローリングなどの質感に使えるかと思います。 illustratorで木の質感を表現する方法 まずは四角形のオブジェクトを作成します。 色の設定は上が#785032、下が#4a3b29のグラデーションを作成します。 続いて[効果] → [テクスチャ] → [粒状]を適用します。 値の設定は、「密度：15」「コントラスト：4」「粒子の種類：縦」にします。 「密度」パラメータを大きくすると、より風化したような木の質感が出せま
今朝出勤して、Googleで画像検索をしたらビックリ！ うおー見やすい！！！ Googleの画像検索はよく使うのですが、今までは画像を開く度にタブとして開いていました。 ちょっと画像を大きく見たいだけでもタブを開く必要があったのですが、それが今回のアップデートで解消されました。 今までどおりの一覧表示は変わりないのですがクリックすると… このように画像の下に拡大画像を表示してくれます。 やたらとタブを開くことは今後少なくなりそうです。 新しくタブを開いた場合のデザインも変更されており、画像がより見やすくなりました。
毎日仕事中と寝る前に見ているDribbble。 一覧では12個のデザインのサムネイルが表示されるのですが、「どうせ12個ならもっと大きくみたい！」って人にオススメの拡張機能を紹介します。 Dribbble HD | Chrome Web Store 普段は250px*150pxで表示されているサムネイルが… このようにDribbbleの表示サイズである400px*300pxで見ることができるようになります。 さらにレスポンシブになるので、27インチのiMacでフルスクリーン表示するとほぼスクロール無しで見ることができます。 ヘビーDribbbleユーザーには嬉しい機能ですね。 Dribbble HD | Chrome Web Store
iOSのデザインをしている上で、どのフォントが使えるのか気になりますよね。 画像で書き出す部分であればiOSにないフォントを使っていても問題はないのですが、デフォルトで使えるフォントもかなり増えてきました。 搭載されているフォントをしっかりと把握すれば、画像で書き出す手間が減るかもしれませんね。 iPhoneで見る場合 Typefaces 2.0.2（無料）<i...es/2338/images/viewinitunes_jp.png" width="90" alt="App" style="vertical-align:bottom;"> カテゴリ: ユーティリティ 販売元: kanotomo – 智彰 Nakano（サイズ: 0.8 MB） 全てのバージョンの評価: （213件の評価） iPhone/iPadの両方に対応 ぼくは基本的にこのアプリで確認しています。 フォントサイ
毎日仕事中と寝る前にチェックしてるUIの参考になるサイトをまとめました。 もう、見ているだけで涎が出ますね。 Dribbble – Following もはや知らない人はいないでしょう。世界中からハイレベルなデザインが集まるこのサイト。3時間に1回は見てます。 JAYPEG 日本版Dribbbleというとわかりやすいかもしれません。昨年末にできたばかりですが、すごく好きです。投稿しまくってます。自分で作ったUIを素材として公開してたりします。1時間に1回は見てます。 Inspired UI – mobile ui patterns カテゴリーが細かく分かれていて非常に嬉しいです。数も豊富で見やすいサイトです。 iOS Mobile Patterns カテゴリーがわかりやすく、マウスが拡大鏡になるので細部まで見ることができます。 iPad and iPhone Design Ins
いつもデザインはillustratorでやっているのでメモ的に。 たぶんチュートリアルだと複雑になるので割愛しているけど、実際にはもっと細かい部分まで作っているんじゃないかなーと思います。 フォトショもいいけどイラレもいいですよ… Tutorial – Create realistic clouds in Adobe Illustrator リアルな雲 Create a Vector Film Slate Icon | Vectortuts+ リアルな映画のカチンコ How to Create a Gearbox Settings Icon Using Simple Shapes | Vectortuts+ アップルっぽい設定アイコン How to Create an iPad Interface in Illustrator – Tuts+ Premium Tutorial |
次のページ
このページを最初にブックマークしてみませんか？
『株式会社ナナメウエ - nanameue, Inc.』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
