タグ

webデザインに関するStrawberryGelatoのブックマーク (6)

  • 【CSS】「これどうやる?」アップルやテスラのWebレイアウト再現テクニック集

    AppleやNike、Teslaといった誰もが知る大企業のWebレイアウトを、CSSで再現するテクニック集がTwitterで投稿され、話題となっています。 CSSのみで表現できる目からウロコのテクニックが中心で、あの驚くようなエフェクトも実はシンプルな数行のコードで表現されていたりします。 コピペできるCSSコードと一緒に、デモサンプルも確認してみましょう。CSSで解決できるテクニック、増えています。 「これどうやる?」アップルやナイキなど大企業Webサイトで利用中のレイアウト再現CSSテクニック集 ノーコードでレスポンシブなデザインを構築できる Builder.io のCEO @Steve8708は、有名サイトで使われている魅力的なレイアウトが、どのように作成されているのか、コピー用のサンプルコードと一緒にみじかい動画で詳しく紹介しています。 ユーザーの視線を奪うアニメーションやレイアウ

    【CSS】「これどうやる?」アップルやテスラのWebレイアウト再現テクニック集
  • エンジニアがデザイナーといい仕事ができるために頑張ったこと|seya

    この記事は下記の記事に触発されて、逆方向の「エンジニアの自分がどういうモチベーションでどうデザインの勉強をしていったか」というのを語ってみよう!という内容となっております。 あと最近よく「なんでデザインし始めたの?」「どうやって勉強してるの?」という質問をいただく機会が増えてきたので、それへのアンサーともなればなと思います。 なぜデザインを勉強し始めたのか結論から言うと必要に駆られて勉強し始めました。 前職はスタートアップに勤めていたのですが、当時作り始めていた新規サービスに携わっている人はエンジニア2名 + デザイナー1名という少数のチームでした。 ただデザイナーともう一人のエンジニアは他のプロジェクトにかかりきり…なので一時期この新規サービスの開発は私だけという状況でした。 そこで困ったのがデザインがないこと。大まかなワイヤーフレームは握っていましたが、デザインがないのでフロントの仕事

    エンジニアがデザイナーといい仕事ができるために頑張ったこと|seya
  • EC初心者が10分で理解するECサイト制作の手順と費用相場

    ※ASPも厳密にはクラウドECに入りますが、この記事ではebisumartのような「フルカスタマイズ可能なクラウドEC」をクラウドECと定義します。 ebisumart(エビスマート)公式サイト それでは、次に個人でECサイトを制作する方法を順に解説します。 ①個人の場合は無料ASPから始めよう! もし、個人でECサイトを始める方は、まずは「BASE」や「STORES」「カラーミーショップ」という誰でもカンタンにECサイトを作れる無料ASPがありますので、こちらでECサイトの制作をするのをおススメします。なぜなら制作費用が0円だからです。しかもEC制作は、まるでFacebookのアカウントを開設するようにカンタンなので、予算が企業に比べて制限のある個人であれば、これを利用しない手はありません。 無料ASPは初期費用、月額費用とも0円ですが、商品が売れた時に「決済手数料」が3%から5%くらい

    EC初心者が10分で理解するECサイト制作の手順と費用相場
  • 成功法則が詰まったBtoBサイトの標準ワイヤーフレームを無料配布します | knowledge / baigie

    約1年前、BtoB企業における顧客獲得型サイトの勝ちパターンをまとめた『BtoBサイト・チェックリスト』を、ベイジ、才流さん、WACULさんの3社連名で発表し、大きな反響をいただきました。 このチェックリストはブログで公開しただけではなく、私たちのウェブ制作の現場でもフル活用されています。この1年間に手掛けた多くのBtoBサイトが、このチェックリストを満たすように設計され、多くのBtoBサイトでコンバージョン数/率やフォーム誘導数/率の向上など、ポジティブな変化が生まれました。 このような活動の中から、『BtoBサイト・チェックリスト』の内容を満たした『BtoBサイト・ワイヤーフレーム』なるものが誕生しました。これを今回、皆さんにご提供します。リード情報なども一切取らず、そのまま丸ごとお渡しします。 BtoBサイト標準ワイヤーフレームXD版(770KB) BtoBサイト標準ワイヤーフレーム

    成功法則が詰まったBtoBサイトの標準ワイヤーフレームを無料配布します | knowledge / baigie
  • Photoshop、Illustrator、XD、Sketch…結局どれを使ってWebデザインすればいいの? | Stocker.jp / diary

    Webデザイン Photoshop、Illustrator、XD、Sketch…結局どれを使ってWebデザインすればいいの? Thursday, September 27th, 2018 Webデザイン制作で使用するアプリは多様化しており、これからWeb制作をはじめたい方にはどれを選べば良いか分かりにくいかもしれません。 それぞれのアプリケーションには一長一短あり、用途によってどのアプリケーションが適切かは変わります。 この記事では、Photoshop、Illustrator、XD、Sketchに絞り、それらのアプリケーションの特徴についてまとめています。 なお、この記事の内容は 世界一わかりやすいIllustrator & Photoshop & XD Webデザインの教科書 という書籍のLesson 01の内容を一部抜粋し、この記事用にリライトしたものです。 Photoshop向きのデ

    Photoshop、Illustrator、XD、Sketch…結局どれを使ってWebデザインすればいいの? | Stocker.jp / diary
  • ウェブデザインの本質に主眼を置いたデザインガイドライン「ブルータリスト・ウェブ・デザイン」

    by Igor Miske 建築形式のひとつである「ブルータリズム」を基に、ウェブサイト来のあるべき姿に焦点を当てて作られたデザイン手法が「Brutalist Web Design(ブルータリスト・ウェブ・デザイン)」です。「雑誌ではないが雑誌のような記事が載っている」「アプリケーションではないが商品の購入やユーザーとのやり取りに使える」「データベースではないが、データベースによって動く」といった複数の側面を持っているのがウェブサイトであり、サイト訪問者に対してコンテンツを純粋に楽しむための方法として提供されるものであるとして、ブルータリスト・ウェブ・デザインは構築されたとのこと。そんなブルータリスト・ウェブ・デザインのガイドラインを、エンジニアのデイビッド・コープランドさんが記しています。 Brutalist Web Design https://brutalist-web.desig

    ウェブデザインの本質に主眼を置いたデザインガイドライン「ブルータリスト・ウェブ・デザイン」
  • 1