large_Crossover Series NFTs.png

medium_Crossover Series NFTs.png

small_Crossover Series NFTs.png

thumbnail_Crossover Series NFTs.png

From Photography to NFT Art: Twisted Digital Landscapes with Nate Hill

From Design System to ‘NFT Design System’: Creating TinyFaces

Neurodiversity and Inclusion: Choosing Kinder Design

medium_652ccf22c8853584bde5553986a4eed0.png

small_652ccf22c8853584bde5553986a4eed0.png

thumbnail_652ccf22c8853584bde5553986a4eed0.png

Web5 is here. Goodbye Web3? TBD.

Published on <a href="http://ift.tt/2souMVI">| Prototyping: From UX to Front End &mdash; Medium</a> Sean Hervo 
<h4>Hardware and software that won’t break the bank</h4>
<img alt="" src="http://ift.tt/2seYwW2">
When it comes to learning design/development it’s important to ensure you’re using decent equipment. Whether you’re a student or going the self-taught route, you’ll probably be trying to keep costs to a minimum. So to help you (and your bank account) I’ll be discussing ways to save money on hardware &amp; software without sacrificing quality. Plus, I’ve even added a list of great learning resources.
<h3>Hardware</h3>
The most important tool for a designer by far, a lot of people worry about software first, but trust me from experience; having the latest and greatest software is pointless if you’re trying to run it on a piece of junk.
<h4>Mac OS machines</h4>
Mac’s are known as the most popular platform for designers. Windows is catching up a little bit but you’ll find most designers use OSX/Mac OS. The reason? Stability, reliability and exclusive applications — Sketch, I’m looking at you.
Mac Mini (from £479 UK, $499 US)
<img alt="" src="http://ift.tt/2rFEV4c">Image Credit: Apple
The cheapest way to access Mac OS legally. A good machine for beginning your career. I have the entry-level 2014 model and it runs all the programs I need. Sketch, Principle, Photoshop, Illustrator all run fine, there’s slowdown at times but nothing terrible.
Just add an affordable HD monitor (I recommend LG due to their high colour accuracy), keyboard &amp; mouse, and you have yourself a capable budget setup. While hardly ideal, the Mac Mini is small enough to stick in a bag and take to uni, the local library or anywhere you can hook it up to an external monitor.
Tip: Check refurbished prices, I got mine last summer for £330, and was under £500 in total with a 1080P monitor and wireless keyboard &amp; mouse. If you can’t afford a monitor straight away, you can connect it to your TV and use a <a href="http://ift.tt/2sf4xBX">wireless keyboard with trackpad</a>.
💁‍♀️ a good thing in a small package
Macbook Air (from £949 UK, $999 US)
<img alt="" src="http://ift.tt/2rFEVBe">Image Credit: Macworld
I know £949 is not cheap at all, but this is the most inexpensive laptop Apple sells. You get a well designed machine, light and thin with an ok selection of ports. There’s enough power for most applications — plenty of established professionals use a Macbook Air as their daily driver. The 12 hours or so of battery life will easily see you through a whole day without a charger.
The big drawback here is the screen, The 1400 x 900 display is a bit dated these days, colours are good but the viewing angles are poor and it’s not easy to see in direct sunlight.
A Macbook Air refresh is rumoured to be shown at WWDC on June 5th. I’ll add an update when I know the details.
Tip: Check out used prices on Amazon, Ebay etc. You can save at least a couple hundred by going second hand, just make sure you’re buying from a trusted seller and know your consumer rights. Macbook Pro 2015 and 2014 are both viable options too if you can get them for a fair price.
💁‍♀️ air today
<h4>Windows 10 machines</h4>
If you can’t afford to get a Mac, or just don’t like them; there’s a lot of affordable options that give you similar or better specs for far less cost. Windows 10 isn’t as good as Mac OS, at least in my opinion. Microsoft is working hard to close the gap between the two though. Currently it’s a perfectly acceptable experience and set to get better when the fall update arrives. You can opt to run a Linux distribution if you prefer that.
Hp Pavilion Wave (from £510 UK, $529.99 US)
<img alt="" src="http://ift.tt/2sf77YL">Image Credit: HP
Want a fairly powerful PC which is also a great B&amp;O speaker? The HP Pavilion Wave could be the one for you. It’s effortlessly elegant design will look fantastic wherever you decide to set it up.
You’re getting enough power to blitz through most tasks, for a reasonable price. Like the Mac Mini, you’ll need to provide a monitor and other accessories.
Tip: If you’re happy with a desktop setup but want something a bit cheaper, there’s plenty of tower options on the market for under £400 that will get the job done.
💁‍♀️ making waves
Lenovo Ideapad 510S (from £450 UK, $540 US)
<img alt="" src="http://ift.tt/2rFEWFi">Image Credit:
The ideapad has become near-legendary for providing solid performance at a budget price tag. Seriously, go to any university lecture hall in the country and you’re guaranteed to hear appreciative whispers about them.
It’s more than adequate for the job. In design it is very similar to the Macbook Air and a bit better when it comes to specs. It comes with a 6th gen i5 processor, 8GB RAM, 256GB SSD and Full HD screen. Battery life is great at around 10 hours. A steal for the price.
Lenovo has unveiled a new line of ideapads coming out in June 2017. The new models’ feature Kaby Lake processors up to Core i7 and up to 16GB DDR4 RAM and an Nvidia Geforce 940mx GPU, so you should be able to do demanding work on it. They’ll also feature a better trackpad and an even slimmer design. Pricing starts around $740.
💁‍♀️ there’s an idea
ASUS X541UA (from £500 UK, $549 US)
<img alt="" src="http://ift.tt/2seJvn1">Image Credit: ASUS
Good build quality, with i5 processor and 8GB RAM you should be fine using this for most work. ASUS have been putting out some great laptops recently and this one is ideal for getting to grips with design software. It was recognised with a 2016 <a href="http://ift.tt/1LjeYM5">Good Design Award</a>.
ASUS showed off another laptop — the Vivobook Pro — at this year’s Computex. It appears to offer very good value for money. 4K display, i7 processor, up to 16gb RAM and NVIDEA discrete graphics starting at $749. No word on a release date yet but I’ll add it in once I find out.
💁‍♀️ good design is good business
<h4>Chromebook</h4>
You’re not going to be able to run a lot of software options but it’s completely possible to learn design on a Chromebook, with a small bit of compromise. If you’re on a really tight budget then it could be the perfect system for you.
Acer 14 (from £210 UK, $270 US)
<img alt="" src="http://ift.tt/2sfgY0T">Image Credit: CNET
Premium metal design, excellent battery life and a good screen are the highlights of the Acer 14. Other specs don’t sound great on paper but this machine is anything but sluggish thanks to the lightweight OS. A worthy choice if you’re short on cash.
💁‍♀️ cheap thrills
Of course, there is always the option of building a PC yourself, you’ll be able to get much better specs for your cash. As an optional extra it might be worth investing in a screen calibrator if you’ll be doing print work.
<h3>Software</h3>
Affinity suite (£48.99, $40 per program) (Windows &amp; Mac)
<img alt="" src="http://ift.tt/2rFHZgM">Image Credit: Mac Store
This is the Adobe alternative you’re looking for. Currently there is Affinty Designer and Affinity Photo. I own both of these and I must say I’m impressed with what is on offer for such a low price. They don’t quite replace Illustrator or Photoshop for me yet, but they’re damn close; with continued improvements I could maybe see myself getting rid of Adobe in the next couple of years.
Both of these are awesome programs for beginners and pros alike, <a href="http://ift.tt/18io20w">Mother Volanco</a> use Affinity for all their client projects. You can pick both of them up for a mere fraction of what Adobe will charge you and all future updates are included in the price (hooray).
Also, keep your eyes out for Affinity’s answer to InDesign, it’s called Publisher and the beta should be out sometime in 2017.
Sketch (£99, $99)(Mac)
<img alt="" src="http://ift.tt/2rFFMlj">Image Credit: Sketchapp
Mac only but simply the best program right now for interface design, from wireframes to pixel perfect mockups. It’s a lot faster and easier than basically any rival software out there and has fantastic options for exporting assets. It’s worth mentioning that major rivals’ have based their UI’s and a lot of their features on Sketch — showing the standard Sketch managed to set.
Sketch 44 includes responsive layouts and prototyping support with Craft — Making it awesome for product design — the future should be very bright for Sketch. Pair it with Invision or Webflow for more in-depth prototypes, both are free for the basic packages.
Figma (free for starter)(Windows, Mac, Chrome)
<img alt="" src="http://ift.tt/2seIfAl">Image Credit: Figma Blog
Figma is a really exciting prospect, touted by many as the future of design. It’s an amazing tool that is browser based, so it will work on Mac, Windows, Linux and Chrome OS; which is incredible.
Figma is the big rival to Sketch’s crown (XD isn’t quite there yet imo) and offers much of the same functionality — artboards (frames), grids, layer styles, vectors — while also offering powerful real-time collaboration features Sketch doesn’t have . Since it’s browser based, everything is saved in the cloud (including version history), and all team members are going to be on the same software release, eliminating compatibility issues.
Sublime Text (free) (Windows, Mac)
<img alt="" src="http://ift.tt/2rFEXsQ">Image Credit: Codejobs
Most people’s favourite source code editor. It’s small in size, fast, open source and most importantly it is free to use (although you are encouraged to pay a one-off license fee). If you’ve got a Mac and plan to do a lot of front-end then I highly recommend Coda 2 for £89, it’s got built in FTP which is a really handy feature, and has an excellent preview mode as well.
Cloud9 (free for basic tier) (Windows, Mac, Chrome)
<img alt="" src="http://ift.tt/2sflIUe">Image Credit: Cloud9
A full cloud-based development environment. With built in terminal, debugger, split view, and built in image editor. You’ll never lose your code and you can work on the same document from multiple devices.
<h4>Pixlr Editor (free) (Windows, Mac, Chrome)</h4>
<img alt="" src="http://ift.tt/2rFBjz6">Image Credit: Chrome Web Store
Not the best image editing software on the market, but probably the best free one. If you’re using a Chromebook hop onboard. Other users’ are better off with Affinity though.
<h3>Learning Resources</h3>
Once you have the hardware and software sorted, practice is everything. Read books, watch tutorials, listen to podcasts and check out what other designers are creating. Then integrate what you learn in to a workflow that works for you. Sketch ideas on paper whenever you have the chance. Share your work online and don’t be afraid to ask for critique. Don’t expect to see wonders straight away, no one said it was easy, but keep plugging away, put in the hours and you’ll get there. Hard work always yields rewards.
Below is a list of some of the best resources out there to help improve your skills, workflow and mindset.
<h4>Youtube:</h4>
<a href="https://www.youtube.com/user/ForeverDansky/videos">Dansky </a> <a href="https://www.youtube.com/channel/UCeR7U67I2J1icV8E6Rn40vQ">Tutvid </a> <a href="https://www.youtube.com/channel/UCtGGGu_hp8ToQ9BR6Vni19w">Quentin Watt </a> <a href="https://www.youtube.com/channel/UCSdp5logiFTM3SyLJrHabOQ">Maex</a> <a href="https://www.youtube.com/user/DevTipsForDesigners/videos">DevTips</a> <a href="https://www.youtube.com/channel/UC_mkC8ChfzCJcuSqSMwvUWw">Sp0on Graphics</a> <a href="https://www.youtube.com/user/Justthisgood/videos">Justin Odisho</a>
<h4>Podcasts:</h4>
<a href="http://designlife.fm">Design Life</a> <a href="http://uxpodcast.com">UX Podcast</a> <a href="http://ift.tt/1h1OXmD">SeanWes </a><a href="http://ift.tt/2rFHiEi">Portrait of a Freelancer</a> <a href="http://ift.tt/2cAqCpx">Shop Talk</a> <a href="http://ift.tt/1MYfkWr">CodeNewbie</a> <a href="http://ift.tt/1VT9gBw">Front End Happy Hour</a> <a href="http://ift.tt/1SiAva9">UI Breakfast</a> <a href="http://ift.tt/2gvN9GU">Developer Tea</a> <a href="http://ift.tt/1FRcuPA">Design Matters </a><a href="http://ift.tt/2oFGCcO">UX Blog</a> <a href="http://ift.tt/2b1qpd9">Product People</a>
Medium Publications: <a href="http://ift.tt/2cAqCpx">Prototyping: From UX to Front End</a> <a href="https://uxplanet.org">UX Planet</a> <a href="https://uiux.blog">Human Friendly</a> <a href="http://ift.tt/2mvMgQu">Code Like a Girl</a> <a href="http://ift.tt/2bkRZmR">The UX Blog</a> <a href="http://ift.tt/1NNXeWU">freeCodeCamp</a>
Books: <a href="http://ift.tt/25ToUG3">Steal like an Artist</a> <a href="http://ift.tt/2sf7139">Creative Block</a> <a href="http://ift.tt/2rFA6Ib">The Design of Everyday Things</a> <a href="http://ift.tt/2seURHA">Don’t Make Me Think</a> <a href="http://ift.tt/2rFUKI5">Hooked</a>
<h4>Courses:</h4>
<a href="http://ift.tt/1S3z77M">UX &amp; Web Design Master Course</a> <a href="http://ift.tt/1x9OCPy">Mobile Design</a> <a href="http://ift.tt/2gZkbvE">Full Stack Web Development</a> <a href="http://ift.tt/2rG5Tsm">HTML5, CSS3 &amp; Bootstrap</a> <a href="http://ift.tt/LfICD8">Treehouse</a> <a href="http://ift.tt/IpP2fG">General Assembly</a> <a href="https://www.lynda.com">Lynda</a>
Thanks for Reading, please share with anyone you think will benefit from this. Let me know if you have any suggestions/recommendations :).
<a href="http://ift.tt/2oSpvse">http://ift.tt/2oSpvse</a>
<img src="http://ift.tt/2seIfQR" width="1" height="1" alt="stat?event=post.clientViewed&amp;referrerSou">
<hr>
<a href="http://ift.tt/2rFFqeL">Learning Design on a Budget</a> was originally published in <a href="http://ift.tt/2cAqCpx">Prototyping: From UX to Front End</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.

Learning Design on a Budget

Learning Design on a Budget

Hardware and software that won’t break the bank

Top Stories