メルカリで値段の「¥マーク」を小さくしたら購入率が伸びた理由、ペイディがサービス名を「カタカナ表記」にする理由など、プロダクトのマーケ施策まとめ30(2023)｜アプリマーケティング研究所
メルカリで値段の「¥マーク」を小さくしたら購入率が伸びた理由、ペイディがサービス名を「カタカナ表記」にする理由など、プロダクトのマーケ施策まとめ30(2023) 2023年に取材した記事から、長く参考になりそうな施策をまとめました。※ 数値等はあくまで取材当時のものです。 1、商品ページの「¥マーク」を小さくしたら購入率アップ（メルカリ）メルカリでは、商品詳細ページの「値段の¥マーク」を小さくしたところ、購入率が大きく上昇した。 理由としては、¥マークを小さくしたほうが、心理的な「価格の圧迫感」が減って、心理的にすこし安く感じるためと考えられている。例えば、¥マークが大きいと桁数が多く感じたり、価格を高めに感じやすい。 この案があがったときには、社内でも懐疑的だったそうだが、テストすると小さな開発コストで大きなリターンを得られる施策になった。 元記事：https://markelabo.c
テクニカルライティングの基本を学べます。業務マニュアル、報告書、仕様書、技術解説書などのドキュメントを書く機会がある方向け。 サイボウズの2023年度 新入社員向け研修の資料です。 Twitter：https://twitter.com/naoh_nak 2022年版（初版）：https://speakerdeck.com/naohiro_nakata/technicalwriting
Web制作の技術は日々進化しており、会社やプロジェクトによっては昨今の環境に適さない書き方をしているケースも時折見受けられます。 そこで今回は「2024年のWeb制作ではこのようにコードを書いてほしい！」という内容をまとめました。 質より量で、まずは「こんな書き方があるんだ」をこの記事で伝えたかったので、コードの詳細はあまり解説していません。なので、具体的な仕様などを確認したい方は参考記事を読んだりご自身で調べていただけると幸いです。 1. HTML 画像周りはサイトパフォーマンスに直結するので、まずはそこだけでも取り入れていただきたいです。また、コアウェブバイタルやアクセシビリティも併せて理解しておきたい内容です。 Lazy loading <img>にloading="lazy"属性を付けると画像が遅延読み込みになり、サイトの読み込み時間が早くなります。
デジタル庁デザインシステムβ版
デジタル庁デザインシステムは、スタイリングの考え方を提供するデザイン言語、情報の視覚表現とインタラクションを具現化するUIコンポーネント、ユーザビリティとアクセシビリティを踏まえた設計や実装のためのガイドラインから構成されるデザインアセットです。 デジタル庁のミッションである「誰一人取り残されない、人に優しいデジタル化を。」の実現に寄与することを標榜し、官公庁や地方自治体などの行政機関や公共性の高い組織等のウェブサイト/ウェブアプリケーション/オンラインサービスまたはシステム等で利用することを念頭に置いて構築されています。
Xの初学者のポストにて古の手法を教わっている方をよく見かけるので、2024年現在そのCSSテクニックはもう古いってものをいくつか列挙しました。 ブロックのセンタリングに margin を使うなら margin-inline:auto を使いなさいmarginを使ってブロックのセンタリングを行う際によく教わるのはmargin:0 autoあるいはmargin:autoでしょう。
こんにちは！株式会社Rabeeの新人デザイナーのakaneです🏋 今回は、Webデザインで「紙っぽさ」を出す方法を考えてみました。参考事例も掲載しながら紹介していくので、どうぞ最後までお楽しみください！ はじめに：「紙っぽさ」とは？私が言う「紙っぽさ」とは、おもに「雑誌っぽさ」のことです。Webデザインだけど、雑誌っぽい。ディスプレイに映っているけれど、エディトリアル感がある。 たとえば、以下のようなデザインは私にとって「紙っぽい」例です。 出典：六本木未来会議出典：DMN出典：ぼくのおじさんどうして、私はこれらを雑誌のようだと感じるのでしょう？自分なりに考えたポイントを、ひとつずつ紹介していきます。 その①：文字が「組まれて」いる最初に挙げたWebサイトのひとつをよく見てみると、画像左上にある「NO. 153」の文字のうち、「NO.」だけが縦向きになっています。「NO.」と「153」を
「どうすればAIをWebデザインに活用できるだろう」 人工知能AIがこれだけ話題になったいま、Webやグラフィックデザイン、イラストやゲームなどクリエイティブな業務をこなす人なら、一度は考えたことがあるかもしれません。 答えのひとつはずばり、Midjourneyなどの画像生成AIでイメージを具現化すること。 しかし、そうは言っても入力できるプロンプトは無限にあり、実際にどのように入力すれば最高の結果を得ることができるのか、すべて調べるのはあまりにも大変です。 そこでこの記事では、Midjourneyを１年間使い続けて見つけた、Webデザインに使えるMidjourneyプロンプト、小技テクニックをまとめてご紹介します。 具体的なサンプル例とプロンプトを一緒に記載しており、コピペでそのまま利用できます。 「Midjourneyって何？」というひとは、基本の使い方をまとめた以下のガイドを参考にど
広告ブロッカーの除外設定に、ドメイン「smhn.info」を追加するようお願いいたします。 お願いするに至った背景と、解除方法について解説します。 広告ブロッカーの浸透は「現状、やむを得ない部分がある」 すまほん!!は、主に広告掲載収入によって日々の取材、レビュー、記事更新を行っています。 最近、アプリストアのランキング上位に広告ブロッカー（Adblock）が表示される例が見られ、浸透している様子がうかがえます。弊誌の広告収入も減少しています。 確かに、最近では日本の各種大手媒体が「画面を埋め尽くすほど異常に大量の広告を表示する」「記事タイトルのリンクをクリックしても、記事ではなく利用者の意図しない全画面広告を表示する」「バックキーの操作を乗っ取って広告を表示して戻るのを妨害する」などの極めて悪質な手法を取るようになっています。 Google、広告業者、大手メディアの著しい劣化であり、この
“消えない広告” ×マークが押せません!? | NHK
スマホを使っていて、イラッと感じること、ありませんか。 「×マークが小さくて、消そうとしたら、意図せず広告に触れてしまった」 「×マークを押そうとしたら、急に広告が動き、誤って広告サイトに飛んでしまった」 ウェブでの不快なことを聞いたある調査では、「広告を誤って押してしまったり、押しそうになった」と答えた人が、最も多いという結果でした。 実は、これ、「ダークパターン」と呼ばれ、世界で問題になっています。 （デジタルでだまされない取材班 芋野達郎） 押す気はないのに、広告を… マーケティングのリサーチ会社「クロス・マーケティング」が、20代から60代の1100人に、ウェブサイトやアプリを利用している際に感じる不快なことを、複数回答でたずねました。 すると、最も多かったのは『広告が表示され、押す気はないのに誤って押してしまった（押しそうになった）』で、29.5％、およそ3割にのぼりました。 続
Magic UI
UI library for Design Engineers20+ free and open-source animated components built with React, Typescript, Tailwind CSS, and Framer Motion. 100% open-source, and customizable.
2023年も終わりに近づき、この1年間に収集したツールを振り返りながら、Web制作に役立つお気に入りを見つけてみましょう。 素晴らしい新ツールや素材がたくさんリリースされ、選定にはたっぷり時間がかかりましたが、カテゴリ別に幅広くセレクションできました。 本当に役立つかどうかだけを考え、「これ、神ツール。」と思えるものをピックアップ。 話題の的だったAIをうまく活用すれば、ワークフローを格段にスピードアップさせ、面倒な作業もストレスなくこなすことができます。 この記事では、そんなあなたの役に立つ2023年公開のWebデザイン制作ツールや素材をまとめてご紹介します。 整理したカテゴリは以下の通り。
弊社Nucoでは、他にも様々なお役立ち記事を公開しています。よかったら、Organizationのページも覗いてみてください。 また、Nucoでは一緒に働く仲間も募集しています！興味をお持ちいただける方は、こちらまで。 はじめに 人は見た目が9割 皆さん一度はこの言葉を耳にしたことがあるのでしょう。内面がどれほど素晴らしくても、外見がそれに見合わないと、なかなか本当の価値を認めてもらえないものです。 この話は人間だけでなく、アプリケーションにも当てはまります。どれだけ内容が素晴らしくても、見た目がイマイチだったり使い勝手が悪かったりすると、ユーザーに敬遠されてしまいます。(私は以前ネ⚪︎フリからア⚪︎プラに切り替えたのですが、使いにくく感じたため、すぐに元のサービスに戻しました) エンジニアの皆さん、優れた技術力を持ちながら、デザインが原因でユーザー離れを招いていませんか？そうならないよう
本書は Figma によるデザインシステムコースの日本語訳になります。デザインシステムに興味がある人や構築しようとしている人もチェックしてみてください。デザインシステムに縁のないデザイナーや開発者のためにプロダクトと向き合った最適なデザインシステムを探求するための材料になれば嬉しく思います。 (原文 : https://help.figma.com/hc/en-us/sections/14548397990423-Course-Introduction-to-design-systems) この記事は、Figmaから許可を得た上で翻訳され、Brand Guidelineに則った内容となっております。(Brand Guideline: https://www.figma.com/ja/using-the-figma-brand/) ## 更新情報 [2023/7/1] - 表紙画像に、このコ
これでもうUIデザイン用の高品質なSVGアイコンに困らない！ 商用利用無料、改変も自由な太っ腹ライセンス -blendicons
WebサイトやスマホアプリのさまざまなUIデザインにぴったりな、シンプルなソリッド・ベタ塗りからおしゃれなカラーまで揃ったSVGアイコンが完全無料で利用できるblendiconsを紹介します。 アイコンはなんと、200,000個以上！ ベーシックなUIをはじめ、ショッピングサイト、タッチジャスチャー、日用品や家具、飲食物、スポーツ、ミュージックなど、多種多様なアイコンが揃っています。 blendicons Blendiconsはデザイナーやデベロッパーが容易に必要なアイコンを手に入れられるように、200,000個以上の高品質なアイコンを作成し、ダウンロードできるようにしたサイトです。 アイコンの利用にあたっては個人でも商用でも無料で、Webサイトやスマホアプリをはじめ、プレゼンや印刷物などあらゆる用途に利用できます。アイコンをカスタマイズして利用することもOKです。ただし、アイコン素材をそ
モニクル社内3分LTで発表しました。技術職以外の人向けに話したので、抽象度高めにしてあります。
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
テクニカルライティングの基本 2023年版
令和のHTML / CSS / JavaScriptの書き方50選
あなたが教わってるそのCSSテクニックはもう古い ｜ TAKLOG
Webデザインで「紙っぽさ」を出す方法を考えてみる｜akane
Midjourneyを１年間使って見つけた、Webデザインに使えるプロンプト全ガイド
【お願い】広告ブロッカーの除外設定をお願いします。 - すまほん!!
便利で差がつく、ずるいWeb制作ツール・素材90選【2023年ベスト】
【閲覧注意】イライラ不可避なUIデザイン10選 - Qiita
Figma によるデザインシステム入門
次世代Web認証「パスキー」 / mo-zatsudan-passkey