Implementing a PSD design into a .tpl website - task-parallel-library

I am new to the whole web design business so I started to design websites using Photoshop. After my first design project I've sent the designs to the developer who then asked me to implement the design into the old site and cut it up. So he gave me a username and password to the server in which the site is being stored. The whole website uses .tpl files and I have no idea how to even start implementing the design. Do I have to start from scratch? Can I use photoshop?

Related

Language to Create User-Friendly Web Applications

I wish to create web application for users. So far, I have been developing mock-ups on PowerPoint.
I've asked around and I've been told to study HTML, Javascript, CSS. The books I find from https://www.allitebooks.in/ are for super-beginners, i.e. how to write "hello world", how to use css to select font and color.
Then I saw that Duolingo wrote it's website in Scala. To me, Duolingo is a user-friendly, easy-to-use website that allows user interactions to type, drag-and-drop.
But can Scala be useful?
Right now, I am looking to create a web application that takes user input and dynamically updates webpages. The web application is mostly graphics (I'm more of a visual person)
Also, user should be able to drag and drop things. For instance, if there is a bowl of fruit, how to allow users to type in description, and drag it where they wish?
One more thing. If user decides to save data, it should be saved on the cloud (user has account, but they don't have to download software).
Application is free for individual users, but huge organizations need to pay nominal fee.
A website being user-friendly doesn't have anything to do with what language it was built with. A good design is what makes a website more appealing and as you said user-friendly. Designs are typically made in softwares like Photoshop, Sketch,Xd... Now once you have a design you like, comes the web dev part of building a website. Typically this is split into two parts:
Frontend : Here you implement the design using HTML, CSS and JS. There are no alternatives as browsers only understand these languages. HTML is used to create the structure of the design. CSS is used to style the different elements. JS is a programming language used to make pages more dynamic.
Backend: Here we deal with tasks than need to be tackled on the server i.e Login, singup,send email etc. Now because a server can be thought of just being a computer,you can technically use any language that has capabilities to make http requests. Here Scala can be used. Typical languages include PHP, Python, NodeJS etc.
I kept this brief and didn't want to go in much detail, just to paint a picture of what is used for which purpose. I recommend before thinking about building a website like duolingo, to take some kind of course that explains in detail how websites are built.

Web User Interface design and smart watches. What considerations to make?

I dont know enough about smart watches but i figure that at some point, browsing web sites on them will become a standard feature. The "Web Browser for Android Wear" app on google play has more than 100,000 downloads and the "WebBrowser for SmartWatch" app has more than 10,000
To that end, given that smart watches like Sony's SmartWatch 3 has a 1.6” screen, what should web designers need to take into consideration when making their web pages as portable as possible? Is there a set of standards? What kind of functionality and behaviour should one expect of a page displayed in a smart watch browser?
Although SO isn't the best place for this question, I'll chip in. As far as I know, designing for wearables is still a new thing, and as per say, I haven't come across any standards as such.
But I think responsive web design should do just fine.
People are working on designing websites for smart watches. Here.
However, think about using the standard manufacturer APIs to build more robust and interactive experiences than just relying on websites on tiny screens.
Here's an article from Net Tuts+ that shows you how to design for the Apple Watch using existing web technologies. Bear in mind it doesn't beat native at all.

Development methodology for CMS driven websites

This is quite a generic question, and I hope to hear what opinions people have on this, rather than a dedicated answer.
Ive been developing for about 6 years and have recently joined a new team. I am self taught. I have been given a project to develop a Magento driven ecommerce site, and a large portion focussing on editorial/blogging sections.
When I work with a CMS (i realise not CMS's work the same), to complete a project my methods have always been in the following order:
Develop the front-end (html, css, js).
Integrate front-end templates onto CMS
Compile CMS functions to fill out contents in placeholders on thos templates (replacing any dummy text etc).
Inject content.
When I explained this to my colleagues they looked horrified.
So they work a different way around:
Compile functions on CMS
Inject content.
Add styles (html templates, css, js etc).
Add to the equation, my scenario, the ecommerce website im developing must be responsive on devices.
So my question is, having I been doing this wrong for the last 6 years? Complete the front-end first? Or compile the front-end after?
I would really like to hear what people think about this. I am self taught, so have never had official training on development patterns such as this.
Thanks
It rather depends on the system used. Some systems allow you complete flexibility in the front-end, others (such as Magento) are more restrictive in what they allow.
At my company we usually use something akin to your preferred method; but I know that a partner of ours developed for Magento in the way of your colleagues.
So, my guess is that you both are right and that it is dependent on the choice of product.

MVC3 - lightweight CMS that can be added to existing application?

I'm trying to find a CMS that can be incorporated into an existing MVC3 app.
I've played with N2, and can't get the damn thing to work in VS2010 or with .NET 4.
Umbarco doesn't appear to support MVC yet
Orchard looks great, but wants to own the whole application.
DNN is just a mess.
Any other brilliant solutions?
Post-mortem Dec 2011
This is an old post, but I thought I'd share my experiences with Orchard, and why I decided to go a different direction.
NHibernate
Aside from the very large number of transactions per page (literally dozens in some cases), each and every query was executed using sp_executesql. While not quite as bad as using Exec(), this rubs me the wrong way. Currently, my database is locked down so that applications can only execute stored procedures - that is, they can't perform select/update/delete, list entities such as tables, get any metadata, etc. This is a requirement for tier-wise unit testing, compile-time verification of the database, security and encapsulation of database logic from the application code.
Source Deployment
Orchard requires that the entire source for your site (views, .cs source files, etc) is deployed to the production server. The sheer number of source files that need to deployed boggles the mind.
Integration with an existing application
The manner in which Orchard is structured effectively requires it to be the point of entry for the web application. This means that you're going to spend some time modifying and reimplementing your app to get it to play nice with Orchard.
Conclusion
There were quite a few other issues that I encountered, but those are the highlights. Individually, each of those could have been a deal breaker. Together, they removed Orchard as a viable solution.
I'm now evaluating Telerik's Sitefinity. It's not MVC, which saddens me, but:
The admin interface is extremely powerful. Aside from a master page and some stylesheets that I put together in VS, we've been able to handle all of the layout via Sitefinity's admin tools.
I mean, it's really powerful. You can use the admin interface to edit the admin interface. Think about that for a minute.
Widgets are implemented as ASP.NET user controls. Most of my existing controls just dropped right in with zero modifications.
Database access is handled via Telerik's OpenAccess ORM. While Sitefinity doesn't natively use stored procedures, OpenAccess fully supports using them for all operations. Also, according to Telerik, OpenAccess does not, in any way, rely on reflection, which provides significant performance benefits in heavy-load apps.
There are several solutions available for using Razor markup within widgets, which is one of the great benefits (to me) of using MVC. Also, I've been told that native Razor support is in active development.
It's not free. In reality, however, a few grand barely breaks the noise floor in terms of development time.
Super crazy fast. Startup time is a bit on the slow side, but once it's running, it's very quick.
Built on top of Telerik's awesome, proven RAD controls.
Apologies for the long post. Hopefully this will be helpful.
You might find these projects useful. You can probably model a simple CMS based on one of their projects.
MvcCms
MvcMS
Atomic CMS
Mytrip.mvc
Try Web Noodles..The new CMS developed using mvc3. WebNoodles.It is easy to integrate .But the thing is it is still in beta stage..But you must give it a try ...

What Software Do You Use To Create Sitemaps / Site Structure For Large Sites?

Just wondering what software you use to create a visual sitemap / site structure representation before you start big sites?
I am looking to map out a large site, but cannot find any good software to help me map the site visually (And in pages/categories)..
Maybe SketchFlow http://electricbeach.org/?p=145 ? which is included in the Expression Blend Trial http://www.microsoft.com/downloads/details.aspx?FamilyID=92E1DB7A-5D36-449B-8C6B-D25F078F3609&displaylang=en
I strongly suggest taking a look at this tool: http://www.balsamiq.com/products/mockups
The Balsamiq tool is the best for doing mockups (i assume this is what you are referring too when talking about sitemaps before you start...). With this software you can quickly generate a working wireframe of what ever you are creating. So much functionality that you can actually share it with your client to get some good sign offs prior to typing the first bit of code.
Very powerful!
And the other one...just shown at the last MIX09 is SketchFlow. Couldn't remember it to save my life. This is a WAY COOL tool for site maps and UI mock up. I was trying to find you the actual MIX presentation as it is super cool to watch. But here are some YouTube videos of that presentation from a user perspective I guess.
http://www.youtube.com/watch?v=zsAZjb7FKXA
http://www.youtube.com/watch?v=f3ErrS68YMM
Check it out!
update...found the SketchFlow video!!! http://videos.visitmix.com/MIX09/C01F
Great keynote from there too: http://videos.visitmix.com/MIX09/KEY01
I know this is an old question, but for others who find this via search, I personally love mocking my websites up with mind mapping tools. I've tried several but my favorite was MindNode for Mac and Xmind for Windows.
XMind free download:
http://www.xmind.net/
MindNode free download:
https://mindnode.com/
I've also tried MindMeister which works just as well as other mind mapping tools and is hosted for you so you can access your mind maps anywhere. However, MindMeister only allows you three maps (currently) without upgrading to a paid subscription.
Another that I've worked with is mockflow.com which is great for mocking up websites with all their features and buttons and even making clickable navigation. They have a free version, but again it's very limited without upgrading to a paid version.
I'm using Slickplan. This cloud based app allows me to have access to my projects from different machines regardless of their operating systems. All I need is one of the leading web browsers (Chrome, Firefox, Safari).
With Slickplan you can create visual sitemaps from scratch or you can use Site Crawler to import your existing website to visualize and reorganize its structure.
Of course you can always export your projects to the XML format, and use the exported file to create pages and menu systems inside some popular content management system - Slickplan provides plugins for WordPress, Joomla, concrete5 and a few more.

Resources