お洒落なワイヤーフレームのサンプルサイト10事例まとめ
Webサイトを作る時に始めに考えることの一つがワイヤーフレームです。ワイヤーフレームのサンプルで、私が良いと思ったサイトをメモがてらご紹介します。全て海外のサイトになりますが、デザインの参考にしたい方はぜひチェックしてみてください!
海外のワイヤーフレームサンプルサイト
I ♥ wireframes
![I ♥ wireframes](/wp-content/uploads/blog/275/001.png)
ワイヤーフレームのサンプルが800種類以上掲載されている海外の有名サイト。スマートフォンアプリからタブレットまであります。
WireframeShowcase
![WireframeShowcase](/wp-content/uploads/blog/275/002.png)
一つ一つのウェブサイトが作りこまれたワイーフレームのサンプルサイト。
Flickr: The I ♥ wireframes Pool
![Flickr: The I ♥ wireframes Pool](/wp-content/uploads/blog/275/003.png)
手書きのワイヤーフレームの写真を列挙しているFlickrアカウント。手書きの時点でお洒落です。
Flickr: The I ♥ wireframes Pool
Great Wireframe Examples
![Great Wireframe Examples](/wp-content/uploads/blog/275/004.png)
Pinterest上でワイヤーフレームのサンプルを紹介しているアカウント。25枚のワイヤーフレームがPINされています。
40 Examples Of Web Design Sketches And Wireframes
![40 Examples Of Web Design Sketches And Wireframes](/wp-content/uploads/blog/275/005.png)
ワイヤーフレームのスケッチが40枚紹介されているブログ。
40 Examples Of Web Design Sketches And Wireframes
18 Great Examples of Sketched UI Wireframes and Mockups
![18 Great Examples of Sketched UI Wireframes and Mockups](/wp-content/uploads/blog/275/006.png)
こちらもワイヤーフレーム、アプリのUIスケッチが18枚紹介されている海外ブログ。
18 Great Examples of Sketched UI Wireframes and Mockups
40 Brilliant Examples of Sketched UI Wireframes and Mock-Ups
![40 Brilliant Examples of Sketched UI Wireframes and Mock-Ups](/wp-content/uploads/blog/275/007.png)
さらにこちらも、ワイヤーフレーム、アプリのモックアップのスケッチが40枚紹介されているブログ。
40 Brilliant Examples of Sketched UI Wireframes and Mock-Ups
24 Professional Examples of Web and Mobile Wireframe Sketches – Designmodo
![24 Professional Examples of Web and Mobile Wireframe Sketches - Designmodo](/wp-content/uploads/blog/275/008.png)
さらにさらに!Webサイト及びモバイルのワイヤーフレームスケッチが24枚まとめられているブログです。
24 Professional Examples of Web and Mobile Wireframe Sketches – Designmodo
25 Examples of Wireframes and Mockups Sketches | inspirationfeed.com
![25 Examples of Wireframes and Mockups Sketches | inspirationfeed.com](/wp-content/uploads/blog/275/009.png)
海外のWebデザインなどを発信するブログ。ワイヤーフレームとモックアップスケッチの事例が25個紹介されています。
25 Examples of Wireframes and Mockups Sketches | inspirationfeed.com
10 Fresh Beautiful Examples of Website Wireframes | Mockup Builder Blog
![10 Fresh Beautiful Examples of Website Wireframes | Mockup Builder Blog](/wp-content/uploads/blog/275/010.png)
Webサイトの美しいワイヤーフレームが10個紹介されています。丁寧に作りこまれていてキレイですね。
10 Fresh Beautiful Examples of Website Wireframes | Mockup Builder Blog
終わりに
Webサイトを作る前に、ワイヤーフレームやサイトマップの作成は重要ですね!良いワイヤーを作れるように、ぜひ参考にしてみてください。