アルタ公式ページ

Alta Facebook

Facebookの軌跡

いいねランキング(直近30日)
1位:
25
【内定式動画、完成!】 2017年10月28日に開催した内定式の動画が完成しました! * 皆さま是非一度ご覧...
2位:
25
【内定証書授与式第2弾!?&本日のおやつ】 2017.11.10☆ 10月28日に行った内定式の際にハワイから中継で...
3位:
25
【展示会に出展いたしました!】 2017.11.08~2017.11.09☆ * 先週の水曜と木曜の2日間、名古屋市西区 b...
半角のバックスラッシュと円マーク

プログラマーの斎田です

Webサイトを閲覧しているときに明らかに半角の「¥」円マークが書かれているべき場所に半角の「\」バックスラッシュがあった事はありませんか?
これは、フォントで使用されている文字参照コードが同じ事に問題があります。
わかりやすく言うと保存している場所が被ってしまってどちらかしか使用できないといった具合です。

フォント指定によってバックスラッシュ、円マークどちらかに化けてしまいます。
主に日本語のフォントでは円マークがでてきて、欧米のフォント指定だとバックスラッシュがでてきます。

そういった場合は文字実態参照コードを使用します。そうすることでブラウザ側で文字を判別して出力をしてくれます。

円マーク:¥
こうすることで円マークを出力できます。

ただ半角バックスラッシュを表示するには、コツが必要です。
通常、日本語のフォントでは表示できないので欧米フォントを使用することになります。
欧米フォントなら半角バックスラッシュはそのまま表示されるそうです。
具体的には

<span style="font-family: Arial;">\</span>
といった感じです。難儀です。
多分、上の文字は
日本語のPCで見ると円マークに見えると思いますが、これがバックスラッシュになります

もういっそのこと半角文字を使用することにこだわらず、円マークとバックスラッシュは全角文字で「¥」「\」と書いたほうがよいのかも知れません・・。

と思った矢先にキーボード右下にあるバックスラッシュを打ち込んでも半角どころか全角も出てきません。どこまでも悩ませてくれます。

「すらっしゅ」と打ち込んで変換するとやっと出てきます。
バックスラッシュの取り扱いは難しいです。
そう滅多に使うものではありませんけど、
円マークをWebサイトに表示するときは、文字実態参照コードを使ったほうが確実ですね。
フローズンヨーグルトにハマりにハマっているデザイナー田中です。
食べごろは冷凍庫に入れて3時間。シャリシャリで美味しいですよ。

スマホユーザーが増えたことで、スマホ対応サイトも随分と増えました。
その一方で、普段はPCから使用しているけど、出先でサイトを見たいとき。
慣れているPCレイアウトじゃなくてなかなか目当てのものが見つからずイライラっ!
なんて場面に出くわすことも増えたりしていませんか?

切り替えボタンがあればいいのですが、設置されていないと、いままでは諦める他ありませんでした。。
ですが、できるんです!そう、iPhoneならね!

【PCサイトを開く~Safari編~】

やり方はサイトを開く。
アドレスバーをタップして、ページ内検索画面にする。
上部分をスライドしてだす。

するとなんとまぁ!
デスクトップ表示 ボタンがあるではありませんか。
なんて簡単なんでしょう。これでいつでも切り替えられます!

ぜひ試してみてくださいね。

ちなみに、一部のサイトではこの機能は無効です。
画面を横に倒したら、少しは近づくでしょうか…。。
(ブラウザ幅に対して変化するタイプのサイト(レスボンシブサイト)は、物理的にできないのです。。)
こんにちは、前髪の癖に悩んでいるデザイナーの尾関です。
直しても直しても元に戻るので、袋小路のこの運命から逃れようと必死です。

WEBデザイナーは、作成したWEBデザイン通りにコーディングをしますよね。そのときに必ず確認するのが、テキストや背景のカラーコードです。
フォトショを起動してカラーピッカーのパネルを開きコードを確認……地味に手間のかかる作業です。

実はフォトショのプラグインに、スポイトでポチっとするだけでカラー情報が出てきてくれる『Hexy』というのがあります。
ダウンロード無料!対応しているのはCC2014です。

スポイトツールでカラーをクリックするだけでコードがコピーできるというシンプルな拡張機能ですが、ひと手間がなくなるだけでもとても作業が楽になるのではないでしょうか。
どうも。へっぽこプログラマ丸山です。

■MySQLで絞り込み条件の高速化

sqlの絞り込み条件(where)にて、サブクエリから導く場合、通常joinで結合してからwhereを書くと思います。
単純なsqlならそのままで良いと思いますが、複雑な条件になってくると、サブクエリによる条件検索は非効率になってきます。

そこで評価したい条件に存在するかしないかだけを調べて絞り込みを行いたい場合はEXISTS関数を使うと良いです。

■例(Zend_Db)
・EXISTSの場合
$select = $db->select()
->from('blog')
->where('EXISTS (SELECT * FROM user WHERE blog.user_id=user.user_id AND user_status=?)', 'active')
->where('EXISTS (SELECT * FROM category WHERE blog.blog_id=cateogry.blog_id AND category_id=?)', $category_id)

EXISTSに書かれたサブクエリに値があったらtrue、何も返さなかったらfalseとなり、whereが評価されます。
joinと違い、結合結果から条件を行ってないので多重リレーションが起こらずシンプルになります。

ちなみにEXISTSの反対、評価がなかったときにtureをしたいときはNOT EXISTSを使います。

サブクエリを使ったsqlで実行が遅いかな・・?と思ったときはEXISTS関数に見直してはいかがでしょうか。
こんにちは、デザイナーの遠山です。

先日、初めてiPhoneアプリのリンクをサイトに貼り付ける機会があったのですが、調べてみるといろいろと細かい決まり事があるようなのでご紹介します。

「App Store マーケティングガイドライン」
https://developer.apple.com/app-store/marketing/guidelines/jp/#downloadOnAppstore

あのよく見る黒いボタンはバッヂと呼ばれているそうです。
余白は○px空けてねとか背景はこうしてねとかいろいろと書かれているので利用する際はガイドラインをじっくり読んで守るようにしましょう。

リンクタグの自動生成方法も下記に細かく書かれていましたので利用する機会がありましたら参考に。
http://www.flag-systems.co.jp/flog/how_to_use_download_on_the_appstore_badge/114/
こんにちは!リスティングプロフェショナルの宮田です。

今回はGoogleにご招待頂き、Googleアドワーズのお打合せに行って参りました。
残念ながら撮影は禁止だったので、写真でGoogleの内部をお見せすることは出来ませんが、社内の様子をレポートしたいと思います。

まず最初に驚いたのは、社内カフェです。
Googleの社内には3~4個位カフェがあり、それらを無料で利用する事ができます。
コーヒー等もかなり本格的で、お店顔負けの立派なカフェでした。
通路には自販機があり、何気なしに見ると、なんと無料!
ボタンを押すだけで飲み物が出てきます。
私はトマトジュースを頂きました。
他にもたくさんのお菓子が無料で提供されていたりと、スケールの大きさを実感しました。
負けるなお菓子部!

また、会議室が無数にあり、フロアによって会議室にユニークな名前がついています。
山手線の駅の名前や、植物、星座など、こんなところにもGoogleのユニークな一面を見る事が出来ました。

他の設備としては、卓球やミニジムやダーツ、PCや電子機器が故障した時に活躍する修理センターや郵便を一括で管理するメールルーム等、語りつくせない程たくさんありました。

通路の壁も和風をイメージした石垣風味になっていたり、東北震災の復興支援のコンテンツが壁に描かれていたり、一日うろついていても飽きないくらい色々な設備、工夫がされていました。

肝心のお打合せもしっかりやってまいりましたので、より高い技術を提供できるよう、精進してまいります。
今回は遊びに関する記事になります。
ずばりゲームのマップを簡単に作れるツールをまとめました!
これからゲームを作る方や、TRPGのGMにおすすめします。

■Dave’s Mapper
http://davesmapper.com/
手書き風のダンジョンマップを生成します。
マップの種類も豊富で、いじってるだけで創作意欲を掻き立てます。

■donjon
http://donjon.bin.sh/
方眼用紙タイプから、ワールドマップまで多数の製作ツールがあります。

■Polygonal Map Generation for Games
http://www-cs-students.stanford.edu/~amitp/game-programming/polygon-map-generation/mapgen2.swf
3Dポリゴンによるフィールドマップ製作ツールです。
丁寧な理論説明もありますが、すべて英語になります。

■Ye Olde Map Maker
http://www.yeoldemapmaker.com/
自動生成ではありませんが、簡易な建物の図面を書くことが出来ます。
iOSやAndroidは有料ですが、デスクトップ版は無料になります。

■方眼紙マッピング
http://www.forest.impress.co.jp/docs/review/20100527_369679.html
方眼紙状のスペースに“壁”や“扉”などのパーツを置いてダンジョンのマップを作成するソフトです。

以上、誰でも手軽に作れるRPGマップツールでした。
他にもダンジョンの自動生成に関しては、海外サイトに詳しい論文やサンプルが数多く存在します。
自動生成アルゴリズムに興味があるプログラマーの方は調べてみると面白いかもしれません。

村木
文字コードUTF-8の見えないバグ

プログラマーの斎田です。

前回に引き続き文字コードのお話です。

基本的に、半角英数のみで作成した場合、文字化けは起こりません。
それは文字コードに共通して同じルールが適用されているからです。
それに比べ、他のマルチバイト文字と呼ばれている文字たちは、
簡単に文字化けが起きます。
それはルールの違い、あるいは、元から存在しない環境依存文字があるからです。

日本語が表示できる文字コードは代表的なのは次の3種類あります。

Shift_JIS
UTF-8
EUC-JP

文字化けをできるだけ回避するにはUTF-8を使用すると良いです。

UTF-8は文字範囲が広く、どの国の文字も文字化けしない、ほぼどんなPC環境でもデフォルトで読むことができるのがメリットです。
(国内のガラケーは対応していないものがあるのでShift_JISを使用するのが無難です)

最近、Webサイトを作る時はUTF-8を使用されている所が非常に多いです。

ただ、このUTF-8で、注意しないといけないことがあります。
UTF-8には、BOMつきというものがあります。

BOM(バイトオーダーマーク)とは、UTF-8以外にもUTF-16など様々なUTF(各符号化形式)が存在しており、それを区別できるようにつけるものです。

UTF-8にこれがついているとHTML上ではたいした問題は出ませんが、PHPなどの後ろで動いているプログラムが絡むと文字化けを起します。

非常に厄介なのが、知らないうちについていること、これがついているか判別する事が、使用しているアプリケーションによってはできないということです。

たびたびこれがついていて文字化けが起きるといった症状を目にします。

UTF-8はWebサイトを作成する際には、特にBOMをつける必要がないので、アプリケーションの設定や保存する時に使用しないようにしましょう。
先週金曜日(2月13日)、アイセック 名古屋大学委員会の若者たち2名がアルタに訪問されました!

「アイセック」という団体は、海外の学生を日本企業へインターンシップとして紹介し、学ぶ機会を学生達に与えるというのが主な活動内容です。運営するのも世界中の学生達という非常にアクティブな若者で組織された世界最大の学生団体です。

今回アルタを訪問して下さったのは、名古屋大学の西澤薫(法学部 2回生)さんと齋藤光之介(経済学部 2回生)さんのお二人です。

グローバル展開を図るアルタにとっても、縁の深い団体でもあり、何かお役にたてることが出来ないかと考えて、アルタ加藤社長の了解も得て、5万円の協賛金と海外の留学生の受け入れを承諾いたしました。

アルタは海外に視野を向けて絶えずチャレンジしていくIT会社です。世界規模で人材交流も図っていくことを計画しています。元気のある学生さん達は遠慮しずにどんどんとアルタに挑戦してきて下さい。
心よりお待ちしています。

アルタ 一同
学生時代はアルバイト先のポスターをPowerPointで作っていた、デザイナーの小林です。

本日のテーマは「PowerPointで文字間を調整したい!」です。

皆さんは、PowerPointで資料を作っているとき、こんなことはありませんか?

「文章があと1文字のところで1行におさまらない」
「おさまらないのも見栄えが悪いので、文字ポイントを下げている」

そんなあなたにお勧めしたいのが、「文字間隔をつめる」です!

文字間隔を調整したいテキストを選択して、フォントの設定を開くと、[文字幅と間隔]の設定ができます。

ふつうは[間隔]が「標準」となっているのですが、ここを「文字間隔をつめる」に設定すると……。
文字間隔が詰まります!

文字間隔が詰まると、1行におさまらなかったその1文字が、おさまっちゃうかも?
(文字サイズや文章量によっては、上手くいかないこともあると思います)

詰め具合も、[幅]のところで調整できますから、ちょうどいい間隔をさぐってみてください。

ちょっと攻めたいプレゼンのときは、文字間隔を調整した素敵スライドで挑んでみてはいかがでしょうか!!
まだまだ寒い日が続きますね。デザイナーの村木です。
ウェブサイトを作るにあたって、細かな各パーツのデザインには単調になりがちです。
そこで今回は、サイト構成に必要な各パーツごとのデザインサイトをご紹介します。

■ロゴストック
http://logostock.jp/
ロゴデザイン・制作に役立つ、かっこいいロゴマークを集めたロゴポータルサイトです。

■見出しデザイン.com
http://midashi-design.com/
見出しのデザインを集めたWEBデザインギャラリーです。

■ファビコンギャラリー
http://favicon-gallery.com/
複数タブを開く人にとっては、一番目につく場所です。一覧でファビコンを比べることが出来ます。

■フッターデザイン.com
http://footer-design.com/
フッターだけを集めた見本サイトです。

■各パーツごとに閲覧できるサイト
・Croppy
http://croppy.org/
・ブブンデザインアーカイブ
http://bubundesignarchive.jp/
カテゴリー別にほとんどの部品が閲覧できます。全体のデザインも見れるので、イメージのすり合わせに便利です。

如何だったでしょうか。
フッター一つにしても、サイトマップとして活用するのか、サイト全体のバランスを取るためか、広告エリアとして活用するのかなど目的は様々です。
各エリアの目的を明確にすることで、優れたサイトを構築していきましょう。
こんにちはデザイナーの安藤です。
今回紹介させていただきますのは、Adobe Creative Cloudの英語版環境の作り方についてご紹介させていただきます。

もしかしたら、このご時世で、異国の方と作業をすることになるかもしれませんので、何かの機会にお役立てできればと思います。

デスクトップアプリケーションの場合になるのですが、日本語のAdobe製品から、新たに英語版のインストールをすることが必要になります。

1.Creative Cloud デスクトップアプリケーションを起動します。
2.画面右上の歯車のアイコンをクリックし、「環境設定」を選択します。
3.「Apps」タブを選択し、「製品の言語」ポップアップメニューから目的の言語を選択します。
製品の言語から、「日本語」になっているかと思いますので「英語」に変更すれば完了です。

詳しくはAdobe CCのサイトにも情報が掲載されておりますのでそちらでも方法が記載されていますので、参照していただければと思います。

今回はWindowsも英語版の環境でしたが、言語環境が少し変わるだけで、作業環境を準備することが変わりますので少しでもお役立てできればと思います。

安藤
先日、加藤社長が参加しました盛和塾NAGOYAのお土産に
「敬天愛人(けいてんあいじん)」という言葉が書いてありました。
「天を敬(うやま)い、人を愛する」と読み、
神に対して尊んで、礼を尽くし、そして周りの人々を愛すると言う意味があるそうです。
日々の業務に追われて、人を愛することを忘れてしまうこともあるので、
この言葉を胸に日々精進していきたいと思います!
先日、マイクロソフトの厳正なる審査の上、アルタが正式にMSパートナーネットワークとし世界認定されました。
そして、シンガポール支局から栄誉ある公式認定資格の盾が送られてきました‼︎

グローバルな展開をはかるアルタにとって、最高な勲章であり、名誉でもあります。
これを糧に、更に世界中の皆様にお役に立てるようアルタは日々精進していく所存であります。

皆様、日頃、ご支援ご協力を承り誠に有難うございます。
これからも相変わらずアルタをご愛顧のほど宜しくお願い申し上げます。
どうも。へっぽこプログラマ丸山です。

HTML5で実装された「WebGL」。
ブラウザからグラフィックボードに3Dオブジェクトを直接レンダリングをさせる技術です。

以前、この技術をjavascriptで動かす3Dエンジン「three.js」を紹介しましたが、今回は別の3Dエンジン「Babylon.js」をご紹介。

http://www.babylonjs.com/

webGL対応ブラウザでないと閲覧できませんが、サンプルがたくさんあるので、今のブラウザはこんな表現ができるのかと驚かされます。

今後も益々「WebGL + 3Dエンジン」の技術が発展し、HTML+3Dネイティブアプリのような新しい世界が普及していくことでしょう。
プログラマーの斎田です。

文字エンコードはご存知ですか?
もしくは、文字化けをご存知ですか?

よく目にする文字化け現象はこの文字エンコードが原因です。

文字エンコードとはなんでしょう?

私たちは、見たことのない言葉を見たとき、これは何語だろう?と思いますよね。
そしてその言葉を調べて読むためにはその言語が何語なのかをまず知らなければなりません。

コンピューターも同じことをしているのです。
この文字は何語でかかれているのだろう?
この文字は○○語でかかれているからこう表すのだろう。

つまり、簡単に言うと文字エンコードとは、文字をどう認識するかというものです。

表示するブラウザと表示するウェブサイトでエンコードの認識違いが起こると文字化けが発生します。

ウェブサイトを作る場合、データファイルがUTF8という文字コードで作られていた場合、読み込みする場合はUTF-8で読み込まなければなりません。
なにもせずとも頭のいいブラウザは自動で認識して表示してくれますが、認識が難しい場合は勘違いを起して文字化けを起してしまいます。

そうならないためにも基本的にはこのデータファイルはUTF-8で作られていますとデータファイル上で書いてあげなければなりません。
趣味で作られたサイトはこれを書いておらずうまく表示されていないものを見ることがあります。

facebookでは
<meta charset="utf-8" />
と書かれていました。

これはutf-8で作られていますよ。という命令です。
これを書いてあげることによってブラウザはUTF-8と認識して表示してくれます。

うまく表示されていなければブラウザ上より右クリックなどからエンコードというところを選べば切り替えることが可能です。
文字化けで見えないウェブサイトがあればブラウザでエンコードを直接指定すれば大抵は解消することができますのでお試しあれ
アルタフィリピン メンバーと加藤千雄社長とのナイスショットです。
近々、日本とフィリピンの合同親睦会が実施されるそうです。
楽しみです。(^^)
こんにちは、乾燥肌がすさまじいデザイナーの尾関です。
やっと暖かくなってきたと思ったらまた寒くなってきましたね…

CSSの疑似クラス・プロパティってとても豊富ですよね。数え切れない!その気になれば数えられるけどめんどくさい!
「こんなプロパティあったの?」となりかねません。

CSSをしっかり覚えたいという方に、コーダー必読と言われるCSSリファレンスをご紹介します。

『Codrops』
http://tympanus.net/codrops/css_reference/

ページを開くと一目瞭然。リファレンスが6つに分けられてアイテムがズラッと表示されております。
クリックすると、基礎~高度テクニックまで情報が細かく掲載されております。
対応ブラウザも教えてくれますし、サンプルもありますので、これは確かに必読だ!と、コーダーは思わざるを得ないサイトです。

私も最近は家でコーディングに夢中なので、このサイトを参考にもっとCSSを覚えていきます。
ただ、英語サイトなので英語力を身につけなくては…
宝塚部の田中です。

1/25(日)に、宝塚の「ルパン三世 ―王妃の首飾りを追え!―」を観劇してきました!
全体的にコミカルなストーリーで、とにかく面白かったです!
「宝塚でルパン?!どうなるのかなー大丈夫かなー」なんて思っていたけど、"宝塚"という"3次元"に溶け込んでいて、全く違和感なかったです!
ポスターで見るより、みんなずっとずっと素敵でした!

観劇後は、明石焼きを食べにいきました。
あつあつふわふわのたこ焼きを汁につけて食べるんです。
これがまた美味しくて、お腹いっぱいになるまでおかわりしちゃいました。

また面白そうなのがあれば観に行く予定です、
次は何がやるのでしょうか。楽しみです!
名古屋市主催「名古屋挑戦型企業塾」冊子にアルタが掲載されました。