Responsive design - proces projektowania

Responsive design – proces projektowania

Czas na kolejne wiadomości z tematu responsive design. Proces projektowania strony pod RWD nie jest rzeczą prostą. Na szczęście w internecie znajdziemy kilka narzędzi, które nam w tym pomogą.

Znamy już wady i zalety stosowania metody responsive design na stronach internetowych, podjęliśmy decyzję, że jest nam potrzebna, a założenia strony pozwalają na jej wdrożenie. Przechodzimy więc do procesu projektowania, który na chwilę obecną nie jest wcale łatwy. Jest tak ponieważ na rynku ciągle występuje deficyt narzędzi, które służą stricte do projektowania responsywnych stron. Graficy przyzwyczaili się do projektowania layoutów w popularnych programach jak np. Adobe Photoshop, czy Adobe Illustrator, nie dają one jednak pożądanego efektu (jeśli chodzi o responsywność). Trzeba pamiętać, że ciągle tworzymy tylko poglądowy obrazek, dlatego znajomość kodowania jest coraz milej widziana wśród rekrutowanych pracowników kreatywnych.

Jednak zanim przejdziemy do projektowania look & feel naszej responsywnej strony warto zastanowić się nad problemami użyteczności. Jeżeli projektujesz UX, powinieneś zadać sobie trzy podstawowe pytania:

  • Jak będzie wyglądał layout strony na mniejszych urządzeniach?
  • Jak będzie wyglądała gradacja informacji na mniejszych urządzeniach?
  • Jak będzie wyglądała nawigacja na mniejszych urządzeniach?

A przy odpowiadaniu na te pytania trzeba pamiętać, że na większych ekranach możemy pomieścić większą ilość elementów horyzontalnie, że strona będzie wypełniona contentem (a nie lorem ipsum) oraz, że nawigacja często jest wielopoziomowa. Warto również zastanowić się nad tym czy strona na urządzeniach mobilnych powinna zachować większość elementów i funkcjonalności strony desktopowej, czy działać efektywniej. Oczywiście najlepiej, jeżeli uda nam się pogodzić jedno z drugim, ale nie zawsze jest taka możliwość.

Oczywiście wielkość ekranu urządzeń mobilnych oraz proporcje obrazu dyktują nam pewne rozwiązanie. Mianowicie mowa tu o schemacie wertykalnym, pionowym. Taki schemat pomaga nam uniknąć wielu problemów np. z ustalaniem hierarchii informacji, bo przecież naturalne jest to, że to co najważniejsze jest na górze. Taki schemat jest często nawet bardziej intuicyjny od desktopowych wersji, gdzie chcemy jak najwięcej elementów upchnąć w poziomie.

Twórcy oprogramowania do prototypowania stron i aplikacji, już wprowadzają rozwiązania pomagające nam w procesie projektowania stron responsywnych. Metoda jest stosunkowo świeża, wymaga więc edukacji i zmiany przyzwyczajenia całego rynku. Myślę, że za kilka lat, projekt strony responsywnej wpisze się na stałe do minimalnej oferty wykonania strony internetowej w każdej agencji.

Projektowanie graficzne

O projektowaniu graficznym za dużo nie chciałbym pisać. Trendy się zmieniają, dlatego swoją uwagę bardziej skupię na narzędziach pomagających nam projektowanie stron responsywnych. Tak jak pisałem mało jest narzędzi stricte graficznych, dlatego znajomość CSS jest w tej chwili niezbędna dla grafików, którzy chcą tworzyć responsywne strony!

Pagelayers – oprogramowanie na komputery z systemem MacOS służące do konwertowania stron www do pliku gotowego do użycia w Photoshopie. Kolejne elementy HTML przerabiane są na warstwy możliwe do edycji.

Mueller Grid System – system gridów w CSS znacznie ułatwiający kodowanie responsywnych stron.

960 Grid System – podobnie jak wyżej.

Adobe Edge Reflow – narzędzie od Adobe służące do generowania responsywnego kodu CSS.

115 myśli na temat “Responsive design – proces projektowania”

    1. Spamer! :P A tak serio to przyzwoity link ;) Za jakiś czas zbiorę do kupy ciekawe linki dotyczące responsywnego designu. Pozdrawiam

  1. You can certainly see your skills in the paintings you write. The arena hopes for more passionate writers such as you who aren’t afraid to mention how they believe. At all times follow your heart.

  2. Pingback: dormetrilopila
  3. I simply want to say I’m newbie to blogging and site-building and seriously enjoyed you’re page. Most likely I’m likely to bookmark your website . You really have amazing stories. With thanks for revealing your website page.

  4. I just want to say I am newbie to blogs and really enjoyed your web page. Likely I’m want to bookmark your site . You amazingly come with fabulous writings. Thanks a bunch for sharing with us your web site.

  5. I simply want to say I’m newbie to blogging and site-building and actually enjoyed this blog. Most likely I’m likely to bookmark your blog . You actually have superb writings. Appreciate it for sharing with us your blog.

  6. I simply want to mention I am just newbie to blogs and truly enjoyed you’re web page. Probably I’m going to bookmark your site . You certainly have incredible well written articles. Regards for revealing your blog.

  7. you’re in reality a good webmaster. The site loading pace is amazing. It seems that you’re doing any distinctive trick. In addition, The contents are masterpiece. you have done a excellent activity on this matter!

  8. I was just looking for this information for some time. After 6 hours of continuous Googleing, finally I got it in your site. I wonder what is the lack of Google strategy that don’t rank this kind of informative sites in top of the list. Usually the top web sites are full of garbage.

  9. great publish, very informative. I ponder why the other specialists of this sector don’t understand this. You must proceed your writing. I am confident, you’ve a huge readers’ base already!

  10. Unquestionably believe that which you said. Your favorite justification appeared to be on the net the simplest thing to be aware of. I say to you, I definitely get annoyed while people think about worries that they just do not know about. You managed to hit the nail upon the top and also defined out the whole thing without having side-effects , people can take a signal. Will likely be back to get more. Thanks

  11. I simply want to say I’m newbie to blogging and site-building and really enjoyed this web site. Most likely I’m going to bookmark your website . You really come with very good articles and reviews. With thanks for sharing your website page.

  12. Its like you read my mind! You seem to know so much about this, like you wrote the book in it or something. I think that you could do with some pics to drive the message home a bit, but other than that, this is magnificent blog. A fantastic read. I’ll certainly be back.

  13. I am now not sure the place you are getting your info, but great topic. I needs to spend some time learning more or figuring out more. Thanks for wonderful information I was looking for this information for my mission.

  14. Good post and right to the point. I am not sure if this is truly the best place to ask but do you guys have any thoughts on where to employ some professional writers? Thx :)

  15. I was just seeking this information for some time. After 6 hours of continuous Googleing, at last I got it in your web site. I wonder what is the lack of Google strategy that don’t rank this type of informative web sites in top of the list. Normally the top websites are full of garbage.

  16. I just want to tell you that I’m beginner to blogging and site-building and certainly loved your blog site. Most likely I’m want to bookmark your blog post . You certainly have impressive well written articles. Cheers for sharing with us your webpage.

  17. I precisely wanted to say thanks all over again. I am not sure the things I might have taken care of in the absence of the entire opinions shared by you over such a area. It had become a real challenging scenario in my circumstances, nevertheless spending time with the professional strategy you handled the issue took me to weep for gladness. Extremely thankful for your help and trust you recognize what an amazing job you are always providing training people through the use of your website. Most probably you’ve never encountered all of us.

  18. I really appreciate this post. I¡¦ve been looking all over for this! Thank goodness I found it on Bing. You’ve made my day! Thx again

  19. I think this is one of the most vital info for me. And i am glad reading your article. But should remark on some general things, The web site style is wonderful, the articles is really nice : D. Good job, cheers

  20. I want to express appreciation to the writer for rescuing me from this trouble. As a result of checking throughout the the web and coming across strategies that were not helpful, I assumed my life was done. Living without the solutions to the problems you have solved by way of the review is a critical case, and ones which might have badly damaged my career if I hadn’t come across your site. Your primary competence and kindness in playing with a lot of things was crucial. I don’t know what I would’ve done if I had not come across such a thing like this. I’m able to now look ahead to my future. Thank you very much for the expert and results-oriented guide. I won’t hesitate to endorse the website to anybody who would need recommendations on this situation.

  21. hello!,I really like your writing very much! percentage we be in contact extra approximately your post on AOL? I require a specialist on this area to unravel my problem. Maybe that’s you! Looking forward to see you.

  22. I really appreciate this post. I have been looking everywhere for this! Thank goodness I found it on Bing. You have made my day! Thank you again

  23. I¡¦ve recently started a blog, the information you offer on this site has helped me tremendously. Thank you for all of your time & work.

  24. You could definitely see your skills within the work you write. The sector hopes for more passionate writers like you who are not afraid to mention how they believe. Always follow your heart.

  25. I have recently started a website, the info you provide on this web site has helped me greatly. Thank you for all of your time & work.

  26. I’m not sure where you’re getting your info, but good topic. I needs to spend some time learning much more or understanding more. Thanks for excellent info I was looking for this information for my mission.

  27. Thanks for the sensible critique. Me and my neighbor were just preparing to do some research about this. We got a grab a book from our area library but I think I learned more from this post. I’m very glad to see such wonderful info being shared freely out there.

  28. My spouse and i have been very satisfied John managed to finish off his investigation using the ideas he received through your blog. It’s not at all simplistic to simply find yourself freely giving strategies which others might have been trying to sell. We really already know we need the website owner to be grateful to for that. The entire explanations you have made, the easy blog navigation, the friendships you will give support to foster – it’s got mostly wonderful, and it’s making our son and us reason why this concept is amusing, which is highly mandatory. Thanks for everything!

  29. I simply want to say I’m new to blogging and seriously loved your blog site. More than likely I’m planning to bookmark your blog post . You definitely have superb stories. Thanks a lot for sharing your website.

  30. Hey there, You’ve done a fantastic job. I will definitely digg it and personally recommend to my friends. I’m sure they will be benefited from this web site.

  31. It is truly a nice and helpful piece of information. I am happy that you shared this helpful info with us. Please stay us informed like this. Thank you for sharing.

  32. Hi there, just became aware of your blog through Google, and found that it’s really informative. I’m gonna watch out for brussels. I will appreciate if you continue this in future. A lot of people will be benefited from your writing. Cheers!

  33. I and also my guys ended up looking at the good guides on your website while quickly I got an awful suspicion I had not thanked you for them. All the young boys appeared to be as a consequence passionate to read through all of them and already have unquestionably been using those things. Thanks for being quite considerate and also for selecting certain nice resources millions of individuals are really needing to discover. Our own sincere regret for not saying thanks to you earlier.

  34. I¡¦ll immediately grasp your rss feed as I can not to find your e-mail subscription hyperlink or e-newsletter service. Do you’ve any? Kindly permit me recognize so that I may just subscribe. Thanks.

  35. My brother recommended I might like this web site. He was entirely right. This post actually made my day. You can not imagine just how much time I had spent for this information! Thanks!

  36. I was just searching for this info for some time. After 6 hours of continuous Googleing, at last I got it in your website. I wonder what is the lack of Google strategy that do not rank this kind of informative websites in top of the list. Usually the top sites are full of garbage.

  37. Hello my friend! I wish to say that this post is amazing, nice written and come with approximately all significant infos. I would like to look extra posts like this .

  38. Great amazing things here. I¡¦m very satisfied to look your article. Thanks so much and i am having a look ahead to touch you. Will you please drop me a mail?

  39. This is very interesting, You are a very skilled blogger. I’ve joined your feed and look forward to seeking more of your magnificent post. Also, I’ve shared your web site in my social networks!

  40. Just want to say your article is as amazing. The clarity in your post is simply cool and i could assume you’re an expert on this subject. Fine with your permission allow me to grab your feed to keep up to date with forthcoming post. Thanks a million and please continue the gratifying work.

  41. Somebody essentially lend a hand to make seriously posts I would state. This is the first time I frequented your website page and to this point? I amazed with the analysis you made to create this particular submit extraordinary. Wonderful job!

  42. I like the helpful information you provide in your articles. I will bookmark your blog and check again here frequently. I’m quite certain I’ll learn many new stuff right here! Best of luck for the next!

  43. Great blog here! Also your site loads up fast! What web host are you using? Can I get your affiliate link to your host? I wish my web site loaded up as fast as yours lol

  44. Hi there, I discovered your web site by the use of Google whilst searching for a related topic, your site came up, it seems to be great. I’ve bookmarked it in my google bookmarks.

  45. Hiya, I’m really glad I have found this information. Today bloggers publish only about gossips and web and this is actually irritating. A good web site with interesting content, that is what I need. Thank you for keeping this web-site, I will be visiting it. Do you do newsletters? Can’t find it.

  46. I savor, cause I discovered just what I used to be taking a look for. You’ve ended my 4 day long hunt! God Bless you man. Have a nice day. Bye

  47. Whats Taking place i’m new to this, I stumbled upon this I’ve found It absolutely helpful and it has helped me out loads. I hope to contribute & aid different customers like its aided me. Great job.

  48. I simply want to say I’m all new to blogging and site-building and certainly liked this page. Probably I’m going to bookmark your site . You amazingly have wonderful posts. Thank you for sharing your web-site.

  49. Wonderful goods from you, man. I’ve understand your stuff previous to and you are just too magnificent. I actually like what you have acquired here, certainly like what you are stating and the way in which you say it. You make it enjoyable and you still care for to keep it smart. I cant wait to read far more from you. This is really a wonderful web site.

  50. Hey There. I found your blog using msn. This is a really well written article. I’ll be sure to bookmark it and return to read more of your useful information. Thanks for the post. I’ll definitely return.

  51. When it comes to business you want ot be sure that you’ve got all your bases covered. More importantly it seems like you’ve covered the basics in this post.

  52. Hiya, I’m really glad I’ve found this information. Today bloggers publish just about gossips and net and this is really frustrating. A good site with exciting content, that’s what I need. Thank you for keeping this website, I will be visiting it. Do you do newsletters? Can’t find it.

  53. What i don’t realize is in reality how you are not actually much more well-preferred than you might be now. You’re very intelligent. You realize therefore significantly in relation to this topic, made me in my view consider it from so many varied angles. Its like women and men don’t seem to be involved unless it is something to do with Girl gaga! Your personal stuffs nice. All the time care for it up!

  54. We are a group of volunteers and opening a new scheme in our community. Your website provided us with valuable information to work on. You’ve done an impressive job and our entire community will be thankful to you.

  55. Hi, i think that i saw you visited my weblog so i came to “return the favor”.I’m attempting to find things to enhance my web site!I suppose its ok to use a few of your ideas!!

  56. I truly appreciate this post. I¡¦ve been looking all over for this! Thank goodness I found it on Bing. You have made my day! Thank you again

  57. My brother suggested I might like this blog. He was entirely right. This post actually made my day. You can not imagine simply how much time I had spent for this information! Thanks!

  58. We are a group of volunteers and starting a new scheme in our community. Your website provided us with valuable information to work on. You have done a formidable job and our whole community will be grateful to you.

  59. Businesses must carefully manage their business and be mindful of how to leverage technologies that provide maximum productivity, security and ease of use.

  60. I would like to thnkx for the efforts you have put in writing this site. I’m hoping the same high-grade web site post from you in the upcoming as well. In fact your creative writing abilities has encouraged me to get my own site now. Really the blogging is spreading its wings rapidly. Your write up is a great example of it.

  61. I like what you guys are up too. Such intelligent work and reporting! Keep up the superb works guys I¡¦ve incorporated you guys to my blogroll. I think it will improve the value of my site :)

  62. I am no longer sure where you are getting your information, but good topic. I must spend some time learning much more or working out more. Thank you for wonderful information I was on the lookout for this info for my mission.

  63. I¡¦ll immediately seize your rss feed as I can not in finding your e-mail subscription hyperlink or e-newsletter service. Do you’ve any? Please allow me realize so that I may subscribe. Thanks.

  64. Its like you read my mind! You seem to know a lot about this, like you wrote the book in it or something. I think that you could do with some pics to drive the message home a bit, but instead of that, this is excellent blog. A fantastic read. I’ll certainly be back.

  65. It¡¦s really a nice and useful piece of info. I¡¦m satisfied that you shared this helpful info with us. Please keep us informed like this. Thank you for sharing.

  66. I have been exploring for a little for any high quality articles or weblog posts in this sort of space . Exploring in Yahoo I eventually stumbled upon this site. Reading this information So i am satisfied to convey that I’ve an incredibly just right uncanny feeling I found out exactly what I needed. I such a lot surely will make sure to don¡¦t put out of your mind this web site and provides it a look on a continuing basis.

  67. Thanks for any other excellent post. Where else may anyone get that kind of info in such an ideal way of writing? I have a presentation subsequent week, and I am on the search for such information.

  68. Wow! This can be one particular of the most beneficial blogs We’ve ever arrive across on this subject. Basically Great. I am also a specialist in this topic so I can understand your effort.

  69. Just desire to say your article is as amazing. The clearness in your post is just nice and i could assume you are an expert on this subject. Well with your permission let me to grab your feed to keep up to date with forthcoming post. Thanks a million and please keep up the enjoyable work.

  70. What i don’t understood is in fact how you’re not really much more smartly-appreciated than you may be right now. You’re so intelligent. You know therefore significantly relating to this topic, produced me individually imagine it from a lot of numerous angles. Its like women and men are not involved until it is something to accomplish with Girl gaga! Your own stuffs excellent. Always maintain it up!

  71. I do trust all of the concepts you have offered on your post. They’re very convincing and can certainly work. Still, the posts are very short for newbies. Could you please extend them a little from subsequent time? Thank you for the post.

  72. You really make it seem so easy together with your presentation but I to find this matter to be actually one thing which I feel I might by no means understand. It kind of feels too complicated and extremely wide for me. I am looking forward to your subsequent publish, I¡¦ll try to get the dangle of it!

  73. Thanks a lot for sharing this with all people you actually understand what you’re talking about! Bookmarked. Please additionally discuss with my web site =). We could have a hyperlink exchange arrangement between us!

  74. Hi, i think that i saw you visited my website thus i came to “return the favor”.I am trying to find things to improve my site!I suppose its ok to use some of your ideas!!

  75. I have to get across my appreciation for your kind-heartedness supporting individuals who really need help with your situation. Your real dedication to passing the solution all through was particularly invaluable and have continuously encouraged guys and women much like me to attain their dreams. Your personal interesting guidelines indicates so much to me and extremely more to my peers. With thanks; from all of us.

  76. whoah this blog is excellent i like studying your articles. Keep up the good work! You realize, many people are searching around for this information, you can aid them greatly.

  77. I’m still learning from you, as I’m trying to achieve my goals. I certainly love reading all that is posted on your website.Keep the posts coming. I liked it!

  78. Excellent read, I just passed this onto a friend who was doing some research on that. And he just bought me lunch because I found it for him smile So let me rephrase that: Thank you for lunch!

  79. Hello there, I found your website via Google even as searching for a similar topic, your site came up, it appears to be like great. I’ve bookmarked it in my google bookmarks.

  80. hi!,I really like your writing very much! proportion we keep in touch more approximately your article on AOL? I need a specialist on this space to resolve my problem. Maybe that’s you! Looking ahead to look you.

  81. I wish to convey my affection for your generosity for all those that really want help on this one topic. Your personal commitment to passing the message across turned out to be especially important and have continually allowed men and women much like me to achieve their targets. Your entire informative report implies a great deal to me and even further to my office colleagues. Thanks a ton; from each one of us.

  82. Thank you for the auspicious writeup. It in reality was a amusement account it. Appear complicated to far delivered agreeable from you! Nevertheless, how can we maintain in touch?

  83. Hi! I simply wish to give you a big thumbs up for your excellent info you’ve got right here on this post. I am returning to your blog for more soon.

  84. Hello there, just became aware of your weblog through Google, and discovered that it’s truly informative. I am going to watch out for brussels. I’ll appreciate should you continue this in future. Numerous men and women will be benefited from your writing. Cheers! xrumer

  85. I was just looking for this info for some time. After 6 hours of continuous Googleing, at last I got it in your website. I wonder what’s the lack of Google strategy that do not rank this kind of informative sites in top of the list. Usually the top websites are full of garbage.

  86. obviously like your website but you need to take a look at the spelling on several of your posts. Many of them are rife with spelling issues and I to find it very bothersome to tell the reality then again I¡¦ll surely come again again.

  87. I keep listening to the rumor talk about getting free online grant applications so I have been looking around for the best site to get one. Could you advise me please, where could i find some?

  88. I appreciate, lead to I discovered just what I used to be taking a look for. You have ended my 4 day long hunt! God Bless you man. Have a nice day. Bye

  89. whoah this weblog is excellent i really like studying your articles. Keep up the great paintings! You understand, many people are looking around for this info, you can aid them greatly.

  90. We research, develop and provide unique repair solutions for your computer problems. We will always diagnose your machine with no strings attached.

  91. Our experienced Professionals hold industry certifications and have successfully repaired thousands of computers for end users, businesses and resellers.

  92. I do not even know how I ended up here, but I thought this post was great. I don’t know who you are but certainly you are going to a famous blogger if you are not already ;) Cheers!

  93. fantastic points altogether, you simply gained a new reader. What would you recommend about your publish that you made a few days in the past? Any sure?

  94. The the next occasion I read a blog, Hopefully so it doesnt disappoint me about this. I’m talking about, Yes, it was my choice to read, but I really thought youd have some thing intriguing to express. All I hear is really plenty of whining about something you can fix in the event you ever werent too busy in search of attention.

  95. It¡¦s really a nice and helpful piece of information. I am happy that you shared this useful information with us. Please keep us informed like this. Thanks for sharing.

Możliwość komentowania jest wyłączona.