I am building a prototype of a financial visualization app, using Meteor. I have zero experience in programming, the extent of my knowledge is what I have taught myself in HTML, CSS, JS and Meteor over the last year. I have a solid working prototype, enough to showcase the benefits of the app and am continuing to add more features.
At some point, I will either find a technical partner (with equity) or find funding to hire a developer. In the meantime, various people have recommended that I spend some money ($500-$1,000) to hire a designer and give the app a better look. I am open to this but my questions are:
how would I incorporate this design work into my app? Would they work directly in my code? Or would they provide me with mockups that I would then need to somehow replicate in my HTML/CSS?
I would love to make improvements to the app, especially if I am seeking funding, as I will quickly approach the limits of my programming knowledge (this is a side project). I'm missing a step as to how I would do this. Thanks.
In my experience, the designer will create a wireframe for you. Basically a fully designed page with hard-coded dummy data. Then you can take their code and replace the dummy data with live data.
Make sure you use version control for this step. You want to make sure you can revert to your version in case something doesn't end up working correctly.
There are pre-made templates and themes for websites that can be free or cost as little as $100. You don't get a personalized touch, but they can make things look presentable if you don't want to break the bank for a designer.
Related
Context: Ok so I am building a website for a friend. Hes a designer with a high need to daily include his projects (images and text).
Problem:
Ok so I know pretty much how to code in html/css/javascript a front end responsive website, that is the easy part for me, the hard one is the content page. I've never done it so I don't know the best way.
A page that he goes daily put a new project, new images, formatted text (A like a blog). But since he doesn't know anything about coding and front end, it has to be simple enough for him to understand.
Resources: I made several searches and found some websites that allow custom templates with content, one of them standing is wordPress (haven't used it for years). I am currently abusing tumblr for that matter, but their support is quite bad. Should I use one, should I buy a host like bluehost and create my self one, what you guys recommend? I tried google it but perhaps I am not doing it the right way since I am not finding any answer to my problem.
Look, you've come to a programming website, so the most common suggestion you'll get here, and the option I myself recommend is:
MAKE IT YOURSELF!
It really is a fun and very educational experience.
There are many, many ways to do this. In general you'll want to have a front end that communicates with a back end API.
For the front end, there are a lot of options. From templating engines like Jekyll, to MVC frameworks like Laravel, to full fledged high level abstractions like Angular and React, which are admitedly harder to learn but so, so robust, and useful once you've figured them out.
The selection of tools you can use to make the API that supports the website is just as rich. There is ASP.NET for C# (which some people use for the front end as well but I wouldn't), there is Node.JS for JavaScript, with a myriad of libraries and packages to get you started. Flask is a popular option for Python. The list goes on and on.
Oh and dont forget about Ruby on Rails.
As for the interface which your friend will use to add their work, turning all that complicated back end into a simple, easy to use interface is a fundamental part of UX design and, IMHO, quite satisfying once you get it right. Make it sleek and, most of all, intuitive. One shouldn't have to be taught how to use it. It should be apparent from the first time they open the page. You should always ask for their feedback as you are developing it. Some even opt to create mock ups of the interface, in order to get feedback on both its aesthetics and its intuitiveness before a single line of code has been written.
Now, regarding how you'll actually do it, the answer really depends on the tools you opt to use. In general, you'll want to read up on things like the MVC pattern, or React's component architecture. The former is something you'll come across on a wide variety of platforms. The latter is mostly React specific, but in my opinion, understanding how to properly build a website using component architecture means you're in the right mindset, something that will help you no matter how you choose to build it.
All that being said...
Web development is complicated. Creating dynamic websites is a much larger undertaking that designing a static page, or even making an SPA. Though I do wholeheartedly recommend you do it at some point, starting with your friend's website might not be the best idea. Or, you may simply not have the time to sift through all your options, figure out which is best for you, begin the learning process etc.
In that case, there are plenty of publishing frameworks and tool sets to choose from. Wordpress has become very popular in the recent years, and templates and plugins for it are abundant. Alternatives like Medium and Ghost have also gained some traction.
There are plenty of commercial CMS type frameworks. One I have heard good things about is ExpressionEngine. However, I cannot speak for it with certainty.
If you are looking for a website builder, there are also plenty of options out there such as Weebly, Wix, as well as Squarespace. Google sites is a relative newcomer in that department, but seems promising.
So, in summary,
I wholeheartedly recommend building it from scratch. There are many, many languages, frameworks, and tools out there you can choose from, each with its own patterns, best practices and idiosyncrasies. If you lack the time, or simply don't feel like going through that process of building a dynamic website from scratch, you can use one of many tools available. However, that wouldn't be nearly as much fun, and would likely produce an inferior result.
I do small websites for local companies. All I know is HTML5 and CSS3, no JavaScript, no PHP.
I have this client who wants me to make a website for his coffee shop. All good so far. I have an idea for a beautiful responsive design which will get his coffee shop a lot of fame.
The problem:
The guy wants to be able to manage his website, meaning: he wants to add a photo if he needs to, or even some text on a particular page. He doesn't want to depend on me so he wants to do it by himself. The problem is that I can't teach him HTML so he would download the HTML file and write the code for the desired thing.. I need to do beautiful websites for my portfolio.
No Wordpress: I don't like Wordpress because it's limited so I can't be creative with the design. I thought of that as being the only solution requiring his needs.
I'm willing to learn more: if there is a solution that I could implement in one month or two, I will do this and learn what is needed, but can't learn PHP in two months.
Any advice?
You might find that CushyCMS does what you want. From the site:
Allow clients to safely edit content
No software to install, no programming required
Takes just a few minutes to setup
Define exactly which parts of the page can be changed
Produces standards compliant, search engine friendly content
From experience, a couple of downsides:
No choice of editor
You have to add pages that can be edited - the client cannot create new pages.
Can anyone point me to a useful guide for UI designers working in google web toolkit?
As per my comment to bhargava's answer, your designers should be learning UiBinder. The whole chapter about building user interfaces seems appropriate too (to get a better perspective), but UiBinder is what they will be mostly dealing with. Without using UiBinder in your project, you are stuck with Java and that's not something your designers are likely to know (and are probably not keen to :)).
I'd recommend building a simple example (but not too simple - maybe you should "strip" the official mail example) that uses UiBinder and show the designers exactly what you expect them to provide and what should be left as stubs. It all depends on the designers in question - whether all they know is HTML and CSS or maybe they have experience with Java, etc. Tailor the example to your needs - you probably won't "get it right" the first time, but with feedback from the designers (what's hard to understand, what they think should be the responsibility of the programmer, etc.), you should arrive at a good learning tool for future employees and a reference for current ones :)
Well if you're looking on how to use widgets and panels in gwt then i would recommend Roughian Examples
This website provides us the basic usage of the GWT widgets and panels and provides us with enough information just to get things started.
I'm about to start building new start-up so i need some guidelines from you.
What's the best way to plan a website? I don't think like "first design, then the database relations, then start development", but "how to plan the way application is going to work"?
Are there some proven methods, like THE best way to do website 'blueprints', like with some tool or something?
I need as much feedback as you people can give me, this is really important to me.
Links, experiences, everything is welcome =)
I'd like some tool to be able to draw the process like
page
- if logged in - do that
- if not logged in - do that 2
Write it down. On a piece of paper. Draw lines between the related parts.
Rinse and repeat as necessarily.
I'm serious. Tools, fancy diagrams, flowcharts, all look pretty for management, but they get in the way of actually understanding how your app is going to work. If it's so complex you can't get it all on a couple sheets of paper, do a big picture view and then do each sub-section.
If you can get a HUGE whiteboard or piece of butcher paper, it's even better. For some reason, having a large space to work on is fantastic for working things out.
I used to do huge specifications in word...hundred pages or more. I no longer believe in that since as soon as you write it down it is likely to change (your ideas, features, etc.). Instead I suggest that you look at an MS product called SketchFlow (which comes with Blend). This allows you to quickly and without writing any code snap together a working wireframe, sitemap, and mock up. While you can create a high fidelity (it functions and looks very close to the real thing) I suggest that you instead focus on creating a low fidelity mock up. There are sketch styles which looks like hand drawn UI elements. This way you can focus purely on how your product works and no so much about how it looks. If there is too much 'finish' put on your mock up you will get hung up on the "big blue button" syndrome where people are more concerned with how a button looks and less concerned with what it does.
I wrote four articles on wireframes, mock ups, and the like and suggest various tools and why I chose SketchFlow. Then I go into building a mock up in SketchFlow.
http://dotnetslackers.com/articles/aspnet/Building-a-StackOverflow-inspired-Knowledge-Exchange-Sitemap-and-wireframes-with-Expression-Blend-3-and-SketchFlow-part-1.aspx
http://dotnetslackers.com/articles/aspnet/Building-a-StackOverflow-inspired-Knowledge-Exchange-Sitemap-and-wireframes-with-Expression-Blend-3-and-SketchFlow-part-2.aspx
http://dotnetslackers.com/articles/aspnet/Building-a-StackOverflow-inspired-Knowledge-Exchange-Sitemap-and-wireframes-with-Expression-Blend-3-and-SketchFlow-part-3.aspx
http://dotnetslackers.com/articles/aspnet/Building-a-StackOverflow-inspired-Knowledge-Exchange-Sitemap-and-wireframes-with-Expression-Blend-3-and-SketchFlow-part-4.aspx
Hope this helps you!
This is a pretty big question. My best advice is to start by thinking hard about your user, what their goals are etc and then draw up some personas. Personas are descriptions of the typical people who will use your site. Once you have your personas you can start to plan your site.
http://en.wikipedia.org/wiki/Personas
Once you have your personas you can work out user journeys - these are essentially flow diagrams detailing how users will achieve the tasks you want to help them with.
http://www.boxesandarrows.com/view/an_introduction_to_user_journeys
From user journeys you can work out the pages you'll need to create in the form of a site map.
http://en.wikipedia.org/wiki/Site_map
Then finally you can work out the content of the pages as wireframes.
http://en.wikipedia.org/wiki/Website_wireframe
There are loads of tools out there: Visio (http://office.microsoft.com/en-us/visio/FX100487861033.aspx) for the PC and Omnigraffle (http://www.omnigroup.com/applications/OmniGraffle/) for the Mac. Both these tools have web design stencils available for free download on the web. There's also a great online tool call Balsamiq (http://www.balsamiq.com/products/mockups) that allows you to lay out pages without having to use a design tool. In the first instance though a pen and paper are the only tools you need.
Once you have these details sorted you can start to think about data models, graphic design etc etc. However this whole process is iterative and you might say will never be finished :)
Good luck!
Develop your data model first. Even if you don't go whole-hog with UML, get a sense of how your data will be represented.
Come up with some use cases to validate your data model. It doesn't have to be perfect, but it should be 99% there to avoid pain in the future.
Once you have a data model and use cases, your interface needs (in your case, your website) will become a great deal clearer. Of course, I'm coming at this from a purely back-end perspective.
Once you have an interface that's workable, hire a good UX specialist to round out the details for you (both workflow and actual interface).
I was wondering, how does a web designer/developer start out in his buisness with nothing to show (in the sense of a portfolio,) and only his word to show he does good work? How are those people supposed to get buisness?
If you don't have a portfolio and want business, it is best to make your own site look incredible. Show people what you can do with your own site. Once your site is incredible, network with companies in your area, friends, family and offer your services cheap if they'll let you use their site as a portfolio example.
Once your portfolio is up, referrals should be coming in and folks seeing your site should be even more interested.
EDIT Per Martin's request, when you build your own site, please don't grab a run of the mill template like every other web developer out there. If you do take a template, make it yours, modify the heck out of it.
The best thing you can do for an empty portfolio is personal projects. I was hired for my first job out of college because I had created a website for my personal business. I was able to show that I had talent because I was in charge the entire site. You shouldn't ever rely on "your word" to get you jobs.
If you need ideas for a personal project, you can see if any friends/family need help, but that can be limiting. Still, it's another project to put in your portfolio to help you get more professional work.
I'd also recommend reading up on online articles dealing with starting a business. Some recommended reading:
alistapart.com/articles/startingabusiness/
alistapart.com/articles/business1/
freelanceswitch.com/general/101-essential-freelancing-resources/
Start by doing projects for people you know and work to create a small selection of work that reflects your current skill set. At the beginning, you may find that your talents are evolving so rapidly that your previous work doesn't reflect your current abilities — that's fine. Try to create a narrative on your portfolio site that shows people your progress and how each piece of work has built on the next.
Your portfolio site should demonstrate both technical and aesthetic skills. If you're an artist or industrial designer, you want your site to fade to the background and push your work forwards. Being a web designer means that your actual site is as important as the work featured on it. Your code should be clean and organized (you don't need to be a standardista, but be tidy).
If there's one skill you should really have before you start to work for clients, it's a sense of typography. You don't want to contribute to the ever-expanding world of poorly set websites.
Good luck.
I completely agree with all of the above - if you can demonstrate your capabilities with some sample work, that will count for far more than a resume in the end. Most of my work has come through people seeing my other work, not knowing my employment history.
Get yourself a domain, build a bunch of sample home pages, create a bunch of sub directories on your site. Make one for a small business, then maybe e-commerce, then maybe a blog, make a few different example scenarios of the types of sites that you would likely be asked to do, I have seen some people design mock home pages in Photoshop and just show them all as clickable JPEGS, that can be quick yes, although I recommend using all live pages on your site to show what interactive things you can do. Up to you, depending how quick you want it up and how important it is to you. I was paid $2500 to make this blog by a guy who was just completely web illiterate. I didn't quote that price mind you, he offered it to me out of nowhere after looking at a gallery of WP templates I had up as "possible" themes for a customer's blog. Sometimes, you are just in the right place at the right time. Best of luck to you.
Do side projects and see if you can build friends' websites (for free, or if they'll pay you, cool). Do whatever you can to demonstrate your abilities. Building a personal site doesn't hurt either.
I'd recommend making an online portfolio, if not to display past projects at least to post your resume and basically a cover letter. You can get a lot of free css templates if you're not comfortable with designing your own.
I'm building a site for my wife and a friend of mine from high school. If you're not getting work, its just the economy. I've been looking for work since March. It's tough.
Just keep at it, and it'll pay off.
You need to create a professional looking site. If you are a developer I also suggest that you start a small open source project (or a big one if you are so inclinded). It doesn't have to be any thing major...a widget or library. Something useful for people to play with. On your website show examples of your work. If you have no examples then sign up for accounts on getafreelancer.com, elance.com, scriptlance.com, guru.com, rentacoder.com and any of the other freelance style sites. Build up your portfolio by doing cheap work...but not work that is cheap! Create a resume and post it somewhere for google to find. Create a linkedin, facebook, and myspace account. Make it easy for people to find you and for people to find your work. Write about the things that you are interested in either by way of a personal blog or by posting articles to a site that already gets lots of traffic. Speak at small user groups or conferences to get your name out.
There is a lot you can do it is just a matter of how badly you want to succeed. Programming or designing is just as much a business as selling physical products. It is all about how much you saturate a given space with good words about your services. Marketing!