nethutのブックマーク (13)

  • 【photoshop】風景写真をイラスト・アニメ風に加工する|ヱノプルギスの夜 / こころ動かす者

    (2019.02.23に書いたブリコルールのブログ記事の引越しです) 写真をイラストっぽく使いたいなどの局面はいろいろありまして、備忘録も兼ねて。 会社の近所で撮影した写真をこんな感じでイラスト風にして、弊社のキャラクターと合わせてみました。まあまあアニメのワンシーンのようにも見えなくもない?? 最近だと、アプリで簡単に写真をイラスト風に変換できるものもありますが、photoshopを使います。 ベースとなるレイヤーを作成・調整する もとの写真はこちらです。 なんの変哲もない、何年か前に撮ってフォルダの奥底で眠っていた写真ですが、空を抜きやすい写真を選ぶとよいです。 【イメージ】>【色調補正】>【HDRトーン…】を選択します。 他のサイトなどでもHDRトーンを使って紹介しているところは多いです。私もこれを使います。HDRトーンの正しい使い方は正直なところ自分はわかっていません…。調整がまと

    【photoshop】風景写真をイラスト・アニメ風に加工する|ヱノプルギスの夜 / こころ動かす者
    nethut
    nethut 2019/05/17
  • ウェブサイトをもっと面白く!コピペ可能なHTML/CSSスニペット75個まとめ 2018年7月度

    ウェブ制作で差がつくテクニックをつかった、コピー&ペーストで利用できる HTML/CSS スニペットをまとめてご紹介します。2018年を代表するグラフィックデザインのトレンドでもある、グラデーションやグリッチエフェクト、ちょっとした動きが魅力的なマイクロインタラクション、CSS Gridプロパティの実践的な使い方など、今後のウェブサイト制作で参考にしたい作品を中心に揃えています。 「Run Pen」をクリックすることで読み込みが開始されます。右下に表示された「Return」で再読み込みし、左上のHTML/CSS/JSタブを切り替えることで、それぞれのスタイリングを確認できます。実際にカスタマイズしたいときは、右上の「Edit on Codepen」をクリックしましょう。これらのスニペットを利用することで、他とは一味違うユニークなウェブサイトを制作してみましょう。 Webサイトを使いやすく!

    ウェブサイトをもっと面白く!コピペ可能なHTML/CSSスニペット75個まとめ 2018年7月度
    nethut
    nethut 2018/07/11
    エフェクトの参考に
  • WordPressをサブドメインからメインドメインに移行する方法

    公開日 : 2015年7月23日 カテゴリ : WordPress 「ドメインを変更するデメリットについて」のページで書いた通り、このブログのURLをサブドメインからメインドメインへ移行させた。 旧URL https://blog.firstsync.net/ 新URL https://www.firstsync.net/ 備忘録の役目もかねて、手順を書いておきます。 同じような作業をやろうとお考えの方の参考になれば幸いです。 WordPressの公開URLを変更 これまでサーバー上でのディレクトリ構成は以下のようになっていた。 WordPressは標準のままだとインストールされているディレクトリが公開トップページになるが、実は公開URLを変更することができる。 WordPressの公開URL(トップページ)を変更したい場合は、WordPress管理画面の「設定」から「一般」を開き、「Wo

    WordPressをサブドメインからメインドメインに移行する方法
    nethut
    nethut 2018/06/11
    WordPressをサブドメインからメインドメインに移行する方法
  • 【保存版】デザインを学ぶすべての人に贈る、配色アイデア見本101選

    配色は、デザインにおける重要な要素のひとつです。この記事では、デザインプロジェクトの参考にしたい、最新の色の組み組み合わせ101種類をご紹介します。 配色は、どんなデザインでも見る人の認識を形成しながら、雰囲気やトーンを設定します。単色や明るい、涼しい、暖かい、または補色であれ、すべての色合いがデザインの役割を果たします。 デザインに適した色を見つける作業は難しいことです。そこで、配色の参考にしたい101種類の色の組み合わせをまとめています。各カラーパレットは、Shutterstockのイメージ画像にインスパイアされており、HEXコードも一緒に記載しているので、ウェブデザインやソーシャルメディア広告、Eメールデザインなど幅広く利用できます。 コンテンツ目次 1. 単色系カラーパレット 2. 寒色系カラーパレット 3. 鮮やかなカラーパレット 4. 暖色系カラーパレット 5. 補色系カラーパ

    【保存版】デザインを学ぶすべての人に贈る、配色アイデア見本101選
    nethut
    nethut 2018/04/25
    配色アイデア
  • CSS GridとFlexboxで驚くほど簡単にレスポンシブレイアウトを実装する方法

    レスポンシブWebデザインの実装に欠かせないメディアクエリを使わずに、CSS GridとFlexboxでレスポンシブなレイアウトを実装する方法を紹介します。 レスポンシブなレイアウトにはメディアクエリが欠かせないわけですが、CSS GridやFlexboxを使えばメディアクエリなしでもレスポンシブなレイアウトが可能です。メディアクエリが全くいらなくなるということはないと思いますが、CSS GridとFlexboxを使えば、メディアクエリの記述を減らす方法があります。しかもコンテンツの幅に合わせて中身のレイアウトを調整するようなエレメント・クエリ的な使い方も、ある程度なら実現できます。 応用すれば今後のレスポンシブなレイアウトのCSSの組み方を変えてしまうような方法です。 ※デモはFirefox 58.0.2、Chrome 64.0.3282.140、Safari 11.0.3でテストしてい

    CSS GridとFlexboxで驚くほど簡単にレスポンシブレイアウトを実装する方法
    nethut
    nethut 2018/03/19
    CSS GridとFlexboxで驚くほど簡単にレスポンシブレイアウトを実装する方法
  • PhoneGapでサーバーから画像・音声・動画をダウンロードして表示・再生まで - Qiita

    <!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>ダウンロードテストアプリ</title> <script type="text/javascript" src="cordova.js"></script> <script type="text/javascript" src="jquery-2.1.3.min.js"></script> <script> var rootDir; document.addEventListener("deviceready", onDeviceReady, false); function onDeviceReady() { requestFileS

    PhoneGapでサーバーから画像・音声・動画をダウンロードして表示・再生まで - Qiita
    nethut
    nethut 2016/11/08
  • PhoneGapでAndroidアプリを作成する過程で生まれた副産物達をGitHubで公開しました - Qiita

    能書き 今頃になってスマホアプリ開発に興味を持ち始めて今年の初めからAndroidアプリ作成に勤しんでおり、最近ようやく1完成しました。 アプリ作成にはPhoneGapという、HTML/CSS/JSでAndroidやiOS、最近ではWindowsPhoneやFirefoxOS対応のアプリも作成することができる(一見)優れ物な開発環境を使用しています。 PhoneGapにはメリット・デメリットありますが、そこら辺の話は詳しく説明されているサイトなどもあるのでここでは割愛しますが、WEB関連の開発知識があればJavaやObjective-Cなどのネイティブ開発用の言語を知らなくてもスマホアプリを作ることができるという意味ではおもしろいツールだと思います。 参考サイト 日語ポータル 解説サイト WEB上で開発できるサービス 今回は、そんなPhoneGapを使ってアプリを作成する過程でいくつか

    PhoneGapでAndroidアプリを作成する過程で生まれた副産物達をGitHubで公開しました - Qiita
    nethut
    nethut 2016/11/08
  • Youtubeの動画を背景に

    Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp

    Youtubeの動画を背景に
    nethut
    nethut 2016/11/01
  • MonacaとWordPressを連携してみた – Webデザイナーでもわかるシリーズ – | ヘッドウォータースのブログ TechNote

    こんにちは! デザイナーのおすぎです。 最近私もMonacaに興味津々なワケですが、 ふと、MonacaとWordPressを連携させて WordPressの記事をアプリに表示できないかと思い立ちました。 もし実現できたらデザイナーでも簡単にアプリの管理ツールが作れちゃいます。 調べてみるとMonacaの運営会社アシアルさんでも 同様の研究があるようです。 特命:WordPressとMonacaを連携させてビジネスチャンスを生み出すこと http://blog.asial.co.jp/1181 ぜひ取り組みが前進するといいですね! 1. WordPressにプラグインを入れる WordPressの記事をアプリ側で表示するためには JSONという技術を利用する必要があります。 JSONについて詳しく知りたい方は下記がとってもわかりやすいです。 jQueryでjsonデータを扱ってみる【入門編

    MonacaとWordPressを連携してみた – Webデザイナーでもわかるシリーズ – | ヘッドウォータースのブログ TechNote
    nethut
    nethut 2016/11/01
  • CSSコーディングで泣かないためのSassの基礎知識と10の利点

    CSSコーディングで泣かないためのSassの基礎知識と10の利点:爆捗! WordPressテーマ作成ショートカット(3)(1/3 ページ) 連載では、CMSのスタンダードでもある「WordPress」のテーマ作成を、Dreamweaverをメインに用いてさまざまなモダンな技術を組み合わせながら爆発的に捗(はかど)らせる方法を解説していく。今回は、現場におけるCSSコーディングの3つの問題点、Sassの概要と主な10の機能、SASS記法とSCSS記法の違いなどを紹介。 連載「爆捗! WordPressテーマ作成ショートカット」では、初回の「Dreamweaverで始めるWordPressサイト構築の基礎知識」で、「Adobe Dreamweaver CC」(以下、Dreamweaver)でWordPressのテーマをカスタマイズできるようにする環境構築や設定を行い、前回の「WordPr

    CSSコーディングで泣かないためのSassの基礎知識と10の利点
    nethut
    nethut 2016/10/29
  • ここ数年のブラウザのデフォルトスタイルシート。縦書きとかHTML5とか。 - kojika17

    最初からブラウザに設定されているスタイルシートを、「User Agent Style Sheets」といいます。(以下、UA Style Sheets) ここ数年でUA Style Sheetsに変化があり、どのような変化があるのか知っておくと、リセットCSSの見直しなどに役立ちます。 UA Style Sheets の margin p要素に定義されているUA Style Sheetsを例にすると、IE8などは私たちがいつも利用しているmarginによって指定されています。しかしGoogle ChromeやFirefoxなどのUA Style Shteetsでは、margin-start, margin-endなどの論理プロパティが利用されています。 IE8: p要素のUA Style Sheets p { display: block; margin: 1em 0; } Webkit:

    ここ数年のブラウザのデフォルトスタイルシート。縦書きとかHTML5とか。 - kojika17
    nethut
    nethut 2016/10/24
  • サイトマップとは?2つの種類・作る必要性・作り方まで丁寧に解説

    ユーザーに届ける価値を徹底的に追求する マーケティングを提供します © Copyright 2022 バズ部. All rights reserved. サイトマップとは、文字通り「サイトの地図」のようなものであり、サイト全体の構成がどうなっているかを一覧で示したものである。 サイトマップには、検索エンジン用とユーザー用の2種類があり、それぞれの役割も必要性も作り方も異なる。

    サイトマップとは?2つの種類・作る必要性・作り方まで丁寧に解説
  • 一瞬で部屋の雰囲気をガラリと変える!「ウォールステッカー」のアイディアまとめ【100均活用】

    2017年5月31日 サービス終了のお知らせ 当社サービスをご利用のみなさまへ いつも『ギャザリー』をご利用いただきまして誠にありがとうございます。 このたび『ギャザリー』は、2017年5月31日をもちまして、サービスを終了することとなりました。 2014年9月よりサービスを開始し、キュレーターがそれぞれの体験に基づいた記事を投稿することで、 ご利用の皆様に新たな発見や、より豊かな生活を送るための選択肢を提供したいと考え、運営してまいりました。 しかしながら、昨今のキュレーションメディアを取り巻く環境により、 今後事業として持続的に成長させていくことは難しいと考えております。 また、場の運営者の責任の有無に関わらず、 キュレーターの自主性に委ねられるキュレーションメディアにおいて、 一次権利者の権利保護を十分に図ることが、現状においては困難なことから、 サービスを終了させていただくことを決

    一瞬で部屋の雰囲気をガラリと変える!「ウォールステッカー」のアイディアまとめ【100均活用】
  • 1