I am well versed with server-side programming using .Net C# and front-end MVC and Angular. I have seen some state of the art websites where they have animations included in webpages. Since it seems like Flash might be on the verge of extinction I do not want to spend time to learn it. What other technologies are they using to add animations to websites? For example to add accessories to cars with animations. Thanks for your help.
You might be talking about WebGL, which is inserted into HTML5 with a canvas tag. It renders graphics with JavaScript but uses a web version of OpenGL.
You can simplify a lot of work with additional libraries for WebGL such as Three.js, p5.js and others. That way you don't have to work with shaders, and build models with individual vertices and polygons.
Related
I want to start developing a mobile hybrid app using angularjs, css3 and html5. Was searching for a framework and found these two. Both are looking very nice however I was not able to get a good comparison between both of them. Can anyone please list down pros and cons for both.
A comparison between them in terms of scalable, out of the box components, speed and compatibility with Angular and devices targeted will be very helpful
One year has passed since both frameworks were released. Onsen UI is currently in stable 1.2 version while Ionic is in the last release candidate state.
I have worked with both of them so let me give you a short overview, I also wrote a much larger blog article, you'll find it at the end of this answer.
I won't go into much details about the core framework; if you have a previous AngularJS knowledge you will easily transition to Ionic or Onsen UI.
Both frameworks are built around AngularJS and they heavily depend on directives, you can also easily build your custom directives. Onsen UI also features a jQuery support (unnecessary if you ask me).
Both frameworks support Android 4+, iOS 6+ (some features are available on Android 2.3), Onsen UI also officially supports Firefox OS and desktop browsers. Ionic don't have an official desktop support, but it will still work (it will not be pretty, imagine ).
Ionic currently don't support Windows Mobile platform (it will have it in the future); Onsen UI support is currently in development (since November 2014).
Both frameworks support some kind of splitview feature so they can be used for table development.
Both frameworks have a distinctive beautiful looking flat UI. I prefer Ionic over Onsen UI look and feel, but this is a matter of personal taste. Both default themes look iOS 7 like.
Onsen UI supports native looking themes for Android and iOS. Ionic framework uses the same theme for all platforms, but some features will depend on the platform (for example tab look and feel)
Both frameworks have a working theme builder.
Ionic supports SASS while Onsen UI is built around Topcoat CSS library.
Both frameworks have a large widget support (directives)
Onsen UI has a better documentation. It is separated at two different locations. First one is “Components” where you can see different directives and each one has a working example you can use and replicate. Second part is a “Guide” where you are guided through the application creation process.
Ionic has a disorganized documentation (heavily fragmented). It lacks a real “getting started” tutorial, even if you have previous AngularJS experience. It shows you pieces, but not how to connect them correctly.
On the other hand Ionic has much larger community so you will easily find problem solutions.
Ionic framework has a great official forum + large StackOverflow community. At the same time, Onsen UI uses only StackOverflow as a help center (I would call this a fail).
Onsen UI has an HTML5 IDE called MONACA IDE (great tool), Ionic IDE is currently in production; you can participate in beta test.
Ionic has a growing 3rd party plugin community (for example date picker); I couldn't find any 3rd party Onsen UI plugin
I wrote a much larger article covering Ionic / Onsen UI changes, find it here.
Since both frameworks are pretty new and not very popular (yet!), I don't think anybody has taken the time to do an extensive comparison between the two. I don't even think the final set of out of the box components is determined by the developers themselves yet, active development is still going on.
As for compatibility, hybrid apps run in the native browsers of the devices where they are installed on. Both frameworks need CSS3, so old phones will never be supported by either of the frameworks.
The OnsenUI-tag here on StackOverflow is the only support OnsenUI offers (currently), and at the moment of writing there are 0 questions/answers. Ionic has a very active forum on their website + some questions/answers here on SO.
I think having an active community backing up a framework will eventually lead to a better framework. Therefore I'd go for Ionic. Personally, I find Ionic's standard-design more appealing as well, but you should judge that for yourself.
Ionic
more lean to Angular style like routes,controllers and template and it's structure is kind of complicated in first hand.
command like "ionic start myApp tabs" still don't available in onsenUI
Material Design like "Cardboard" are available
OnsenUI
simpler structure, easy to start
couple with Monaca IDE, some of features are only available only if you use Monaca. otherwise you have to create things by yourself.
supported ios8 design recently
Ionic has a more mature feature and CSS component set and out of the box. Injectable delegate services, representing the UI elements (directives) gives you more control over UI/UX interactions. The development community is (currently) very active and it's gaining traction.
I cannot properly speak to speed/performance between the two but know both are optimized for mobile.
As I develop more, I will report back with comparisons. Good luck.
Just started using ionic after some time native development. Must seriously say it has some great cli features! For example you can start your project from a gist in my opinion this is nice to have for poc's
Havent been able to test everything but what i've seen really impresses me!
It's well documented in there own way, active community and it keeps getting better.
Just wanted to share my thoughts for what it's worth
Im working in Ionic Framework during 1 year with a real project, i have created a game with Ionic, its very special because hybrid app is not best choice if you want create game. When you develop a game you need performance !
However if you develop simple game with few animation, its good.
Here is my game in playstore, its a memory game "Memory Party" :
https://play.google.com/store/apps/details?id=fr.jhaccoun
Why Ionic is a good choice :
very very very good documentation (tutorial, forum, article,...)
stable (ionic 1), you can find many apps in store
Easy to develop (ionic come with many tools to help the developer, you can develop and test in live in your phone without deploy thanks live reload
Many cordova modules are available
you don't need mobile skills, just angularjs, html, css...
Ionic provide beautiful components and you can custom the components if you like
I found Ionic the best for some reasons, like their community support and the documentation. I am still evaluating the onsen from a long time but still havent found the one unique thing that will drift me towards it compared to Ionic
I am developing a webapp which the most challenging aspect is the 3D model section. It also contains other things such as drag and drop and a sliding bar with arrows each side which the user can go through to select different items.
I have been looking into WebGL but it seems IE doesn't support it without using a plugin. This isn't ideal so I was wondering what other options I have.
Flash? Silverlight? Anything else?
Silverlight is WAY too rare to be used for any meaningful development, and ajax is simply not stunning enuogh. That leaves us with Flash, which in my opinion, is the best of the three options. Flash Player 11 introduces the new Stage3D API which can create pretty stunning 3D graphics. There are also many AS3 libraries for 3D rendering. I prefer Away3D
Just found this, which looks promising.
http://iewebgl.com/
Edit: Disregard, seems the user has to download the executable for it to work.
at the moment flash is most popular plugin for 3D based web apps. which is cross browser, but no mobile browsers support :(
Many technologies and every one have his disatvantages
Simple questions, am I correct with this approach.
I have a page with left, centre and right areas (divs).
Each area has its own Backbone object, MVC/R
Each area has its default HTML via a default JQuery template.
Each Backbone object communicates Restfully to Asp.Net.MVC via JQuery.
Depending on the JSON payload back from its MVC Action(s) an area can switch its HTML via a JQuery template.
I got some code from the ‘net that does JavaScript EventAggregation communications between the Backbone objects in a similar way to Prism for WPF/Silverlight.
Do points 1 to 6 seem generally ok?
Could I use some sort of "pure" JavaScript eventing to replace point 6, if so how would I go about this?
As you can guess, I’m coming into this from a WPF/Silverlight background
Thanks in advance
Your list is good, and is a similar to how a lot of people are building Backbone apps these days. I would recommend against using jQuery templates, though. They are not supported right now, as the jQuery UI team is working on a road map to completely re-write them in to the jQueryUI project.
As for native JavaScript events - no. Stick with an event aggregator implementation that you are comfortable with. There isn't anything native in JavaScript.
You might also find my Backbone.Marionette project to be helpful and familiar. http://github.com/derickbailey/backbone.marionette
I also come from a .NET background, building composite applications (mostly in WinForms, but a little WPF). I've taken all of the core patterns that I used in building Winforms/WPF apps and built them in to Marionette. It removes a lot of the boilerplate code that I would normally write, and borrows ideas from Prism and other composite application frameworks.
We are working on a Mind map based webapp as our final year college project. It will be a website where users will be able to create mind maps collaboratively. The user interface will be very similar to what https://bubbl.us/beta/ and hxxp://www.mindmeister.com/ have.
In a nutshell, the users will have access to whiteboard and drawing tools to create mind maps on a whiteboard. The changes made by one user will be visible to other session users. e.g. A session has three users A, B and C. If A changes mind map, it will be visible on whiteboards of B and C.
We were considering Flex, Openlaszlo few days ago but having limited time (about 3 months) for project completion, we binned those. For Flex we will have to learn Actionscript3 and for Openlaszlo there is no IDE support. So both of them won't be good choices.
We have shortlisted Silverlight and Vaadin frameworks as viable choices but we are confused as we don't have any experience with either of them. We need to take these points into consideration while selecting a framework:
Time frame for project - about 3 months, give or take 2-3 weeks
Learning curve for framework - should be easy (Very relative term indeed..In the context, we are familiar with VB6, PHP, Javascript and Core Java)
Necessary graphics related features supported - such as whiteboard, drag-drop widgets, animations(need not be fancy stuff) etc.
Availability of tutorials and good documentation
There are 2 open source mind mapping applications that can be useful for this webapp.
Silverlight - hxxp://silverdraw.codeplex.com/ (a webapp) - More like a POC design.
Java - hxxp://www.xmind.net/ (a desktop app) - Most of the mindmapping features we need are present. If we use Vaadin, we can re-use some code which is a huge plus point.
We are open to other suitable frameworks. Which framework would you choose?
P.S.: Excuse for obscure URLs'. New users are limited to only one hyperlink.
Disclaimer: I'm a member of the Vaadin Team, and do not know Silverlight very well.
I believe both Silverlight and Vaadin would be good candidates for your application, and for both the biggest challenge will be the client-side implementation of the visual mind-map component.
I took a quick look at XMind and it seems to be Swing based, so I'm afraid that the only way to re-use that would be to wrap the mapping component into an applet. You can easily do this with Vaadin, but it will require the Java plugin in the browser.
If you consider implementing the mindmap component without plugins, you have the following options:
Use the Vaadin core components (eg. the Tree, live example here) to visualize the mind map. Vaadin supports drag & drop, so this would be very fast to implement, and you would need to work with only server side Java stuff.
Create a HTML5 component with Vaadin integration for the mind-map. You can do this with the HTML5 canvas, and wrapping it in a Vaadin component is easy, but it'll require that you code the component with GWT. There are several examples on how to manipulate the canvas with Vaadin and GWT.
Create a SVG component with Vaadin integration for the mind-map. As far as I know SVG supports interactive stuff a little better than Canvas, and there are examples on how to interact with SVG using GWT and Vaadin. Note that the support for SVG is lacking especially with the older IE versions.
All of these options are feasible to implement within your timeframe (depending on what extra functionality you want). The first option is by far the easiest to do, but it might not be fancy enough for your requirements.
We have strived to make Vaadin as easy to learn and use as possible, and I daresay that our documentation is very good. In addition we have a very lively community filled with helpful experts. If you need more information on Vaadin just come over to our forums and we'll help you out.
You are kind off answering your own question. Use vaadin it will be a little extra work but then your saving huge amount of time on the mindmap coding.
Are there any controls that anyone is aware of that I can use to stream firewire video into a WPF app. I do not need camera control or capture just the video. I need WPF hosting because I'll be adding WPF content on top.
I was hoping that with the addition of having direct X surfaces in WPF something like this might appear.
Ideally looking for something relatively high level (not a direct show guy at all).
Thanks,
Brian
There are a couple really good video rendering packages for WPF. This guy Jeremiah Morrill has a blog where he discusses his numerous render projects. There's the WPF Win32 render project, and a number of low-level techniques he documents for how to access accelerated playback, Media Foundation .NET, DVD controls, etc... I believe his blog is titled "Jer's One Stop Shop".
Reading over his blog in general is a good idea if you are in to video/WPF. Last I checked, "MediaKit", one of his more comprehensive projects, enables easy use of DirectShow (simple xaml and your off and running, so don't worry) and other well known native interfaces. It's very robust and actively maintained, if not that specific project, check into some of the recent API's he's contributing on, some various Win7 media support also.
The only reason I'd bring up this other project, Augmented Reality, is that you remarked about adding content "on top". You should definitely check out wpfAugRel if your doing a lot of video production. Where to get an add on for it eludes me, but I'm sure you can find it off that site, but it allows for you to script in python some fairly slick real-time video production.
-- edit --
Right, look at this google code page, it has some video's (picture's worth a thousand words right?), but regardless, it allow's you to mix in 3D content into live-action, through the use of "marker" prop's, essentially bit's of paper with some easily machine recognizable feature's, that facilitate their underlying engine to inject computer rendered output into a real world scene, highly dynamic, so you can toss these marker's around and the 3D content move's fluidly... anyhow good luck.
Check out this article by UberDemo. It captures video into a WMV file with Windows Media Encoder and WPF. There is a paragraph about how to do the preview in a WPF application.