I have been tasked with making a logo designer web application where a user would visit the application, design a logo by selecting custom fonts, colors, images etc and then download the image of his logo. Now me being a mostly back-end programmer (.NET) have never attempted to do something like this and am confused as how to go about it.
I have been googling this but wasn't able to find some plugin/library that would allow me to render a canvas with options to custom design on it. Do I need to manually create this using jQuery UI library? I just need to be pointed out in the right direction..
For reference : looking to design something like logomakr.com
Related
I am developing a new web site and i was looking for a rich text editor which will be help users to write heavy texts easily. Then i discovered amazing app ZenPen.
But as i undestood it is designed as a standalone app instead of using in a web site.
There is no html form support or form elements even. So i am trying to get texts from <header> or <article> tags via jQuery. But i wonder is there another way to achieve this.
If i couldn't achieve this my other alternatives are grande.js or medium.js
Zenpen is not intended to be used as library but standalone product (I wish it could serve both purposes).
ZenPen is a stand alone product, and thats how I'd like to maintain it.
tholman (Zenpen's maintainer)
Source https://github.com/tholman/zenpen/issues/102
I'm working on application with some sort of CMS features. I need some pages to be editable. For instance:
you can edit a text block right in your browser
you can add and remove different modules to your page
For instance, if I have a main page I may want to edit welcome text.
If I have a sidebar I may want to add/remove new modules to the sidebar such as:
email subscription module
social network (facebook, twitter, etc) links block
text block
My application may have several pages, not only one.
I want to keep it simple and I'm looking for the right approach/examples/existing tools.
What's the best pattern / third-party solution for ASP .NET in order to implement this and keep it simple?
If you want to use ASP.NET MVC I think the best solution is to look into Orchard. It's really easy to get up and running, has a rich set of existing modules and building a module from scratch is really easy. This was actually started by a couple of Microsoft guys and then spun out into it's own open source project. http://www.orchardproject.net/
I'm trying to build a basic website, but that doesn't limit my ability to add complexity later. I am a complete newb and have no prior programming experience. I'm very confused as to the role of web editors (e.g. Kompozer) vs. web frameworks (e.g. Rails, Django). For what purposes are each useful for? What makes sense for quickly building a basic, functional website that can be more professionally developed later on?
Kompozer is a WYSIWYG that allows you to drag and drop HTML elements and create your website with buttons, dropdowns and menus. You can view the code it generates and modify it if you need to.
A web framework you would typically not use a drag and drop type editor, but just type code into something that looked like an advanced Notepad. A web framework typically removes a lot of the grunt work and allows you to organize your logic separately from your design.
Basically, you would use a program like Kompozer if you wanted a simple website that didn't do much in terms of functionality. You would use a web framework for doing some heavy lifting with some custom programming... for example if you wanted to design a web application that did calculations based on the food you ate today and gave you dieting information, or where you could login and manage different types of equipment etc...
I'm working on a brand new project for a state government agency that we are going to be using Asp.Net MVC3 as our framework.
My question is I cannot find any guidance on how to make our web app Section 508 (and similar accessibly requirements). This is my first project where this is a requirment. So to implement this do I - For example -
Is MVC3 compliant out of the box just by adding some properties?
Extend the standard controls for this functionality?
Write my own controls?
Any suggestions would be appreciated. We don't really care about how this is implemented as long as it is clean in our Razor view.
Section 508 compliance doesn't have so much to do with the technology as it does the implementation of that technology. If you look at the guidelines, they're (for the most part) implementation details:
Having alt tags for images
Captioning audio presentations
Verifying that information is displayed with cues beyond just color
Documents readable without a stylesheet
Having row and column headers for your tables
Frames (if you're really still using them) must be titled and labelled
Don't add any content that flashes or flickers
When using javascript have descriptive information that identifiers to the user what is happening
The rules go on a bit more, but you get the gist of it. It's not in the technology, it's in the implementation details. You can do all of these things with standard HTML (captioning videos may be a bit trickier)
One other thing I can recommend: The Web Developer toolbar for Firefox (and I'm guessing the Chrome version as well) has a 508 validator option built right in. It will get your up and running on what the reqs really are.
Web accessibility is too broad a subject to cover in a single answer, but it is all to do with your HTML markup - regardless fo controls, or anything else you use. What really matters is the HTML rendered - even if you use some components to assist with this.
You can find a lot more information by searching for "web accessibility" in your favorite search engine, but my high level suggestions would be:
Be proud of your markup, and make it semantic. Use headings only when you actually intend there to be a heading. Within a table, use instead of if the cell is a table header. Use bulleted/numbered lists when that's semantically what you want. Don't miss-use tags to fake appearance.
Then layer on CSS to provide any visual look that you want. Check out http://www.CSSZenGarden.com to see how this is possible.
Finally, add on your behavior using Javascript. Don't mix these three up - with Javascript you can add in event handlers in the jQuery $(document).ready() function; leaving your markup behavior-free.
If you wish to use lots of Javascript libraries and controls, then beware that this is likely to decrease your compliance unless you specifically look for accessible controls which promote progressive enhancement. For a government site, someone without Javascript should still get a good experience, and a blind screen reader user should be able to use your Javascript controls as most screen reader users still have Javascript on.
There are various good articles on choosing your color contrasts, avoiding rapidly changing content, spacing - too much to cover here :-)
No, you need to write your html to be follow the 508 requirements. MVC doesn't do anything special in that regard.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 4 years ago.
Improve this question
As many of you know MVC applications will have one or more of these View elements.
Partial Controls
Views
Strongly Typed Views
And probably others that I don't know yet.
As many developers, I am one of those that has no art for design, I can't think about colors, just about logic. I will like to contract out the graphic design of my small web app, about 7-10 pages. The biggest task is to create a good template (CSS and Master Page) with a good color palette. My question is how do I go about it?
Do I take the View directory and send it to the graphic artist? Do I send the whole application (i will like to avoid that)? Do I take snapshots (jpg, png) of the application now and send it to the GA?
Thanks in advance.
Define an Information Architecture first. Then rough sketch a wireframe of the layout. Then contact a graphic artist and discuss the plan. Have the artist create a mockup. Then revise as needed. Finally, slice up the layout into HTML.
You might want to consider using Themeroller to come up with a basic color scheme. You can use an existing one from the gallery or modify one to meet your needs. This will make it easier to use jQuery UI plugins within your code and, once you figure how how to apply the jQuery UI classes to your own code, help you to layout most of your own look and feel. Once you have the basic look and feel down, then you can ask a designer to come up with specific image elements or find your own stock images at one of many stock image sites.
One way I find that works if you are willing and able to work with Html and Css is to request the design in a PDF. Then edit the site yourself (or some other htmler) until the designer and you sign off on it.
I wouldn't think many designers are experienced in working with the code files and if they are it would probably increase the price. Best to handover at the pdf level and if needs must then outsource the conversion of this to html to someone else or as a different sign off with the designer. Making the agreement on design will be easier and quicker with a Pdf.
It depends on whom are you contracting.
In my experience, the easiest and most productive way of doing this is to send out screenshots or drawings of what needs to be achieved, then sit down at a table with the designer and explain him/her in detail how will the application work.
In return they should give you HTML + CSS + images. HTML and CSS should have clear comments in there, about regions: where is the header, where is the menu, where is the content, etc. It will be up to you to make this into master pages and views. This will allow you to structure your code as it pleases you, without adding burden to the GA who won't do a good job anyway, it they are not technical.
In practice, the GA should produce a navigable HTML prototype. You will "animate" it.
This is how we are doing it:
1.) We create wireframes using Axure RP. We define the basic layout, data on the pages,
actions, transitions between the pages etc...
2.) We create HTML protoype from Axure and send it to the designer (outsource) which designs a page (Photoshop & Ilustrator). We get one psd file.
3.) After we confirm design, the psd file goes to the "coder" (outsource). He cuts the psd file into images & css and codes the html with comments.
4.) We integrate html's into master pages, views, etc...
It works well for us.