増田晶文

作家 増田晶文さんのブランディング、グラフィックデザイン、ウェブサイト構築を手がけました。 小説や書籍などの作品をオンライン上で公開し、増田晶文さん自身の魅力を広めたいという願いを視覚的に具現化するお手伝いをしました。 ウェブサイトは、国内外の多数の主要デザインアーカイブに掲載され高い評価をいただくことができました。 ウェブサイトはタイポグラフィにも気を配りました。 独自の技術である合成ウェブフォントをつかい、美しい文字組みを表現しています。

Masafumi Masuda

I was involved in the branding for the author Masuda. My goal was to showcase his novels and literary works online, visually embodying the desire to spread his charm. The website received high praise and was featured in numerous prominent design archives both domestically and internationally. Typography was a key focus in the website design, utilizing my proprietary technology of synthesized web fonts to achieve a beautiful and harmonious type setting.

増田晶文さんの独自性を尊重し、名前の書体には上品さとラフな雰囲気を兼ね備えた筑紫オールド明朝を選択しました。 この選択は、増田晶文さんの個性を視覚的に引き立たせるとともに、独自の魅力を伝える手段となりました。 一方で、本文には読みやすさを考慮し、リュウミンを選択しています。

Respecting his uniqueness, I opted for the refined yet casual aesthetic of Tsukushi Old Mincho for the font representing his name. This choice not only visually accentuates his individuality but also serves as a means to convey his distinctive charm. On the other hand, for the main body text, leading us to select Ryumin.

...

名刺デザインにおいて、増田晶文さんの独自の作家らしさと上品さを最大限に表現するため、余白を巧みに活用したシンプルで洗練されたデザインを採用しました。 このアプローチにより、情報がクリアに配置されつつも、余白が空間を演出し、洗練された印象を与える効果を生み出しています。

In the design of the business card, I adopted a simple and refined approach, skillfully utilizing whitespace to express his distinctive authorial style to the fullest. This approach allows for clear placement of information while the clever use of whitespace creates a sense of space, contributing to an overall sophisticated impression.

...

デザインのシンプルさは、紙の手触り感と相まって、名刺全体に温かみと独自性をもたらしています。 細部にわたり計算された余白の配置は、増田晶文さんのプロフィールや連絡先情報を見やすく提示する一方で、名刺全体に独特の空気感を与え、印象に残るものとなっています。

The design, complemented by the tactile feel of the paper, imparts a warmth and distinctiveness to the entire business card. The meticulously calculated placement of whitespace throughout details not only enhances the visibility of his information but also infuses a unique atmosphere across the entire card.

...

ウェブサイトの制作においては、コストを抑えつつも品質を損なわないため、Windows環境でも美しく表示されるNoto Serifを選択しました。 この配慮により、増田晶文さんの作品が異なるプラットフォームや環境でも一貫して高品質に魅せることを可能にしています。 またアルファベット部分には日本語との細かいサイズ調整がされた欧文書体を指定し、読みやすく美しいタイポグラフィを実現しています。

I aimed to maintain high quality while managing costs, and thus opted for Noto Serif, ensuring beautiful display even in Windows environments. This consideration enables his works to consistently showcase high quality across diverse platforms and environments. Additionally, for the alphabet sections, I specified a Western typeface with fine adjustments in size to harmonize with Japanese, achieving a typography.

増田晶文さんは作家として活動されており、自身の作品をネット上で広く公開し、読者との繋がりを深めたいと考えていました。 また、増田さん自身の魅力や作品のエッセンスを的確に伝え、その名前を広めることが求められました。

He is actively engaged as a writer, aiming to widely share their works online and foster a deeper connection with readers. Additionally, there was a desire to accurately convey his own charm, capture the essence of their creations, and effectively promote their name.

...

...

増田晶文さんの大切にする要素を詳細にヒアリングし、その要素を視覚的に表現するブランディングを実施しました。 シンプルかつ上品なデザインに、どこか人間らしい温かみを取り入れることで、作家の人間臭さと作品の繊細さを表現しました。

I conducted a listening session to grasp his crucial elements. Using these insights, I implemented a branding strategy, creating a simple yet elegant design that infuses a touch of human warmth. This aims to convey the author's relatability and the delicacy of their works.

増田晶文さんの作品を美しく引き立てるため、ウェブサイトの構築にも注力しました。 作品の閲覧がしやすく、情報が整然と配置されたウェブサイトは、読者に親しみを感じさせる一方で、プロフェッショナルな印象も醸し出します。

I dedicated effort to enhance his works on the website, ensuring easy navigation and well-organized information. The website not only makes it convenient for readers to explore the works but also exudes a sense of familiarity, creating a professional impression.

...

...

また文字が主役になるウェブサイトのためタイポグラフィにも気を配りました。 グラフィックデザインでは、ブランドのための独自の合成フォントを作成しデザインに個性を持たせながら一貫性を持たせますが、合成フォントをウェブでも使用できる独自の技術をつかい美しい文字組みを再現しています。

I also paid careful attention to typography for the website, as text plays a central role. In graphic design, I created a unique synthesized font for the brand, infusing the design with individuality while maintaining consistency. Utilizing my proprietary technology that allows the use of synthesized fonts on the web.

このプロジェクトでは、レスポンシブ対応も重要な要素でした。 ユーザーが様々なデバイスでウェブサイトにアクセスすることを考慮し、デザインの美しさを損なうことなく、異なる画面サイズに適応できるようなレスポンシブなデザインを実現しました。

In this project, responsive design was a crucial element. Considering that users access the website on various devices, I implemented a responsive design that adapts to different screen sizes without compromising the aesthetic appeal of the design.

...

...

ウェブサイトの全体的な魅力を一層引き立てるために、サイト全体にアニメーションを組み込んでいます。 例えば、ページ遷移時における画面のちらつきを排除し、シームレスで滑らかなページ遷移を実現するために、Nuxtを活用したコーディング手法が採用されています。

To further enhance the overall appeal of the website, I have incorporated animations throughout the entire site. For instance, to eliminate screen flickering during page transitions and achieve seamless, smooth transitions, I employed coding techniques using Nuxt.

このアニメーションの導入により、読者はウェブサイト内を移動する際に、不快な遷移効果から解放され、より快適で没入感のある体験が得られます。 Nuxtを用いたコーディングによって、ページ遷移がシームレスかつ画面のちらつきがなくなることで、増田晶文さんの作品やプロフィールに集中しやすくなります。 これにより、増田晶文さんのウェブサイトは単なる情報提供の場にとどまらず、訪れる人々にとって魅力的で洗練されたデジタル空間となっています。

With the introduction of these animations, readers navigating through the website experience a release from uncomfortable transition effects, allowing for a more comfortable and immersive journey. Through the use of Nuxt in coding, the seamless page transitions without screen flickering facilitate a heightened focus on his works. Consequently, his website transcends being merely an information hub, transforming into an alluring space for its visitors.

...

...

アニメーションの取り入れにより、増田晶文さんの文学的な世界観がウェブサイト上でよりダイナミックに表現され、訪問者に深い印象を与えることでしょう。 増田晶文ブランディングの成果として、シンプルで上品なデザインが増田さんの作品と響き合い、作品の本質を的確に伝えるプラットフォームが完成しました。 増田晶文さんの名前を世に広める一助となれたことを嬉しく思います。

The incorporation of animations has dynamically expressed his literary world on the website, leaving a profound impression on visitors. As an outcome of the his branding, the synergy between the simple and elegant design resonates with his works, resulting in a platform that accurately conveys the essence of the creations.

Release

2022

Credits

Logo, Design: Yohei Hashimoto Development: Yohei Hashimoto

Technologies

Composite Web Font Nuxt2+Typescript