タグ

Web製作に関するhitotakuchanのブックマーク (3)

  • [JS]一昔前と比べて、かなり簡単に!ページの機能を紹介するツアーを実装できる超軽量スクリプト -Driver

    ページ上の任意の要素を目立つようにハイライトさせたり、ページの機能を紹介するツアーを実装できるスクリプトを紹介します。 一昔前までのは実装が少し面倒だったり、jQueryなど他のスクリプトに依存していましたが、ここで紹介するのは実装が非常に簡単で、超軽量の4kb! しかも依存は一切無し! 既存ページにもすぐに利用できると思います。 Driver -GitHub Driverの特徴 Driverのデモ Driverの使い方 Driverの特徴 ページ上の任意の要素をハイライト表示します。 Webアプリの機能を順番に紹介することもできます。 ユーザーにフォーカスシフターを追加します。 キーボードでも操作可能で、ユーザーフレンドリーです。 実装が簡単で、他のスクリプトやスタイルシートの依存はありません。 わずか4kbの超軽量バニラ スクリプト。 強力なAPIを備えており、高度なカスタマイズも可能

    [JS]一昔前と比べて、かなり簡単に!ページの機能を紹介するツアーを実装できる超軽量スクリプト -Driver
  • 著作権フリーで実用度高め!商用OKなオシャレ無料写真ストックサイト Skuawk

    ウェブサイト制作や資料づくりなどに活用したい、高品質でロイヤリティーフリーの無料写真を公開している、新しいフォトストックサイト Skuawk をご紹介します。もちろん商用利用も可能で、圧倒的なクオリティーは、写真選択の時間を短縮してくれるでしょう。 他のフォトストックサイトまとめと一緒に利用すれば、写真素材に困ることも少なくなるかもしれません。 「フリー写真」カテゴリを確認する 詳細は以下から。 著作権フリーで実用度高め!オシャレな無料写真ストックサイト Skuawk Skuawk は無料で、美しく芸術的(Free, Beautiful and Artistically Loud)をモットーにしたフォトストックサイトです。公開されている写真はパブリックドメインとなっているので、クレジット表記も不要でコピーや複製、商用利用にも対応しています。 べものや風景、都市、テクノロジー、人など使いや

    著作権フリーで実用度高め!商用OKなオシャレ無料写真ストックサイト Skuawk
  • illustratorでUIデザイン:画面遷移図作成スクリプト - Two hats

    illustratorでUIデザインをし始めると便利だなーと思うところが幾つかあります。 その内、個人的に押しなのは「アートボード」です。 1つのファイルで複数の画面を作成・管理することができ、一覧性が高いのでアプリの全体を俯瞰しつつ1つ1つの画面を作成していくことができます。 但し、単に画面が並べてあるだけなので画面遷移図のような並びにできたら便利だろうなと思いついてスクリプトを作成してみました。 画面遷移図.jsx Githubにもアップしてみました。github.com 使い方 例として、画面検討するためにワイヤーフレームの画面構成図をillustratorで作ったとします。 単に作っただけだと下図のように並んでいるだけです。 1.アートボードに画面遷移図用のタグをつける 「パネル>アートボード」でアートボードパネルを開き、名前にタグを埋め込んでください。タグと言っても難しいことはあ

    illustratorでUIデザイン:画面遷移図作成スクリプト - Two hats
  • 1