webgl vs. 3rd party plugin (unity3d), best option in browser [closed] - html

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 3 years ago.
Improve this question
I have been tasked with rendering and manipulating 3d objects in the browser and really want a robust application. The research that I've done shows two major options here. I can use the new webgl tool in html5. Or I can use a browser plugin such as unity3d (i'm sure there are others and for the point of this question, are equivalent). (Are there any other options that I'm missing?) My needs for the application are fairly standard, however, these are the focal points:
(1) The most important part is the resolution of the scene. I want as many polygons/points as I can get. I want, hopefully, 1 million polygons/points, 10 million polygons/points, 50 million polygons/points? What is realistically possible?
(2) The scene will be largely static, I will load my scene and then I just want to navigate around it and explore that way. I don't need constant changes to my scene.
Weighing the pros and cons, I see the downside of webgl as not having IE support (yet). And using unity inconveniences the user by forcing them to install a plugin (which I view as a huge barrier). If you take those away, is there any performance difference between the two? Will one give me more polygons than the other? I would presume they are the same since they both have direct access to the same hardware on the machine.
Any experience or thoughts on this matter would be greatly appreciated ......

WebGL is perfectly capable of rendering lots and lots of geometry as long as you draw it intelligently. So is Unity. Polygon counts are going to be a pretty moot issue, especially if your scene is static.
What you really want to consider more than rendering speed is factors like tool chains and user accessibility. WebGL has a quickly growing community but not much in the way of mature tools. If you need commercial support maybe Unity would be better. WebGL also lacks IE support as you pointed out, but even on browsers that support it you may not be able to access it if your video card is blacklisted. That said, if for whatever reason you are determined to avoid plugins then your choice is already made, isn't it?
WebGL has an undeniable "geeky cool" factor to it, but that may be completely lost on your target audience. It's also worth considering that Unity is going to be fairly gaming centric, which may or may not be a good thing given your needs. WebGL is more general but lower level.
As far as other alternatives, Flash 11 has Stage3D, which I've heard is very capable, and Silverlight has Molehill, which I've heard next to nothing about (sorry!). Obviously both are plugin-centric, but if you're on the fence they're probably worth at least looking at.

Unity will give you more out of the box, even in terms of performance, than WebGL. This is because Unity already has optimizations for drawing large scenes (culling, batching). In WebGL you may need to write much of this by hand at this point (unless there are some solid WebGL libraries I haven't seen) just to get the same performance. Getting compatible models & textures into Unity is also easier compared to WebGL right now (it's about the maturity of the tools).
Regarding the drawback of needing the Plugin, Unity is releasing at some point in the near future a Flash 11 exporter which will remove the need for the Unity plugin (depending on your scene).

Did you see Burster Plugin? It is open source, it works like unity, but it opens files from Blender - the best 3d editor :) here is website: http://geta3d.com

Related

2D Grid Based Simulation Game [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
I'm not sure where to begin, but my goal is to to create a 2D simulation game that allows the user to create formations using points, or dots, on the grid. I wanted the game to allow the user to direct the points on the grid to their next location, or set of locations, in a continuous simulation from the first formation to the last in chronological order.
Like I mentioned earlier, I am brand new to coding and wanted to know what specifically should I be looking to learn to create this? Also if you have suggestions on what I should use to create this such as Flash, Html5, or something else please let me know.
Are you trying to make Conway's Game of Life?
As far as good beginner game engines go my first couple of games were in GameMaker. I understand the reputation it gets about it not having "real programming" but if you are learning to write code I actually think this works great. No it doesn't have syntax like code does, but it does require you to learn programming logic and that is what is important. Syntax isn't that tricky and you can look it up. Logic and structure, that's hard.
I don't know much about FLash other than that it is kind of a sinking ship and losing support. If it's between javascript and that, go Javascript. When you say
HTML5 or Java, you do not make games in HTML5. If you have an HTML5 game engine like Impact, it's actually javascript code you are writting. HTML5 is just putting the game window in a web page.
I haven't messed with PyGame much, but Python is a fantastic beginner language and I have heard this works for small things like what you want to do.
Love2D gets used for projects like yours a lot. Don't have experience with it myself but you could take a look at it.
I have used Unity a lot for my projects big and small. It's a big learning curve but if you want to learn how you could make "big" games, this is how you should do it. Tons of great beginner learning materials and support, just expect to go through several tutorials(which you should do anyways with whatever you pick) before you can get started.
So you have a start pattern, and a target pattern, and the user must move the points by, say, sliding them along the grid lines, until the target pattern is attained... I think the easiest would be Corona (https://coronalabs.com/, free and excellent docs). It has a very simple game engine which is based on Lua programming language, a very simple language that is also very powerful and versatile such that it will allow you to jump in and support complexifying your game as you learn. Corona is built so you don't have to worry about all the intricacies of getting the code onto the device etc, it has a device emulator so you can test on your desktop. You just focus on creating your callbacks and logic and imagery, they will get used at the appropriate time.
The concepts you will need to develop your game:
- setting up the initial grid and pattern
- drawing lines (for the grid) and circles (for the "points) (presumably, different colors)
- handling a swipe
- updating the state of the grid so you know where the points are
- determining if the target pattern has been met
- keeping score (time used, number of moves required)
- start-over (prematurely with confirmation by user, or when target reached)
Install Corona, look at its intro to Lua, start playing around with it, starting with really simple stuff, actually best is to take existing examples that come with Corona and try to modify them to do something different and gradually diverge from original. The Corona docs and examples are excellent, there is a very active community, tons of youtube videos by avid game developers on tricks and techniques, and corona questions on stackoverflow get quick answers.
Have fun!

2D Unity (for graphics & ease of use): Flash? Haxe? [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 2 years ago.
Improve this question
I'm planning on making a little game. And I'm looking for an engine. Basically what I want is Unity, but then 2D. It's a very interface heavy game, stylized, so what I need is an engine (or similar) in which it's easy to draw lines, primitives and text (and bitmaps, though that's less important.) The game will have a game world, though you'll never directly see it. All you'll get is a bunch of information about it (text, lines, graphs, ...)
I know you could use Unity to make 2D games, though for what I have in mind it's not optimal and the way objects work in Unity isn't really how I want to structure my game. (I've worked a lot in Unity and absolutely love it, though I don't think it's the right tool for this game.)
What I love about Unity is that you can just build for any platform, with a single click, and it just works. It also already has it's own way of building your gameobjects, and since I'm making something very different, I don't want this. I need more control over the objects and actually only want the engine to draw stuff.
I was thinking about using Flash, ActionScript3. It should be very good at drawing lines and text. And hopefully just as easy to build.
I also checked out HTML5 and javascript, using KineticJS, which can draw lines and primites very easily (pretty much exactly like I want it), though I hate javascript and want more structured code. Maybe it's just me that I can't get javascript to be clean enough for my taste, but well, that's something we'll have to live with then :P
My question now is, since I never used flash. What are your thoughts on this. Is it perfect for this kind of stylized text-based games? Is it easy to build (I'm using FlashDevelop since that's a free way to make flash stuff)? On top of that, can I use a single code base for Windows and Mac (maybe even iOS, Android or other, though that's less important)?
Or maybe you have another suggestion I could check out? (I already checked out a bunch of other question here, though none were really helpful. So yea it's another 'I'm looking for an engine' question, so don't kill me for that. I already did quite a bit of looking around, though would love some more input from others.)
Edit1: I've been looking around some more and found Haxe (http://haxe.org/) seems promising, can anyone recommend this or?
I think Flash/AC3 would fit perfectly, especially if you're using FlashDevelop.
To comment on Daniel MesSer:
This means that a programmer "never" has to worry about positioning objects and the visual appearance of the game. The programmer only have to provide the functionality for what should happen when stuff happens (buttons are clicked, animations are complete etc).
This just is not true. If you're work at a company that solely uses Flash CS this might be the case. But with FlashDevelop you've got a fully functional IDE. If you look up some third party libraries like Flixel, Citrus Engine or FlashPunk, you'd find something that could fit perfectly to your needs.
I think that for what you want to do, flash would not be an optimal tool. The beauty of flash and what it was designed to do is to separate and combine what a graphical artist does and what a programmer does.
You see, you have Flash as the tool where you align, position and import/draw graphics and do complex animations. And then you export those as assets and work with the graphical resources from ActionScript. This means that a programmer "never" has to worry about positioning objects and the visual appearance of the game. The programmer only have to provide the functionality for what should happen when stuff happens (buttons are clicked, animations are complete etc).
It sounds as if your game are more in the "techy" family, where you will be working alone, and you want to draw primitives yourself and there will be a lot of text on the screen.
Flash was never intended to be a tool to work with loads of text and doing stuff the techy way, it was created to make it easy to work with loads of graphical resources in a structured way where the programmer doesn't have to worry that much about the graphical content.
If my assumptions of what you want to do is correct, you would be better off working with JS. It would be better suited since you are working with few complex graphical assets, are interested in cross platform support and basically wants to work with loads of text.
I also checked out HTML5 and javascript, using KineticJS, which can draw lines and primites very easily (pretty much exactly like I want it), though I hate javascript and want more structured code.
Write objectoriented javascript :-) I'm a oop-maniac, but I'm starting to find the beauty of js too. It IS possible to write beautiful code even there! ;-)
Regarding flash and AS3, It would be possible, and probably pretty "easy" to use. I started programming using AS2 (well some other stuff before that as well). But personally I dont think flash is the right way to go. Flash have reached it's expiery-date a long time ago.
There are several games coded in HTML5 and KineticJS. You can find some examples on www.kineticjs.com. With HTML5 and kinetic, you'll also be able to make it work for multiple platforms at once.
Hope this helps :-)

Is it possible to make part of the browser transparent to display underlying desktop/windows in a web app? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
I am developing a web application (meant to run work as a rich client and able to afford requiring any (even nightly build) version of Firefox of Chromium).
The application interface background is meant to be transparent (showing underlying windows or desktop). How can I achieve this? Following standards does not matter but would be nice.
Primary target platform is Linux.
UPDATE addressing comments and answers received to the moment of 2010-07-07T01:44Z.
Technically it's nothing about code interaction and breaking the "sandbox". It's about window composition. I even think it can be implemented pretty easy in a compositive window manager without a browser even knowing of this - just replace some useless colour (for example "fuchsia" was widely used for this during Windows 9x age) with the underlying layer content.
Politically, this can and should be a restrictable function (like local file and webcam access, for example), which can be allowed for trusted intranet applications (local web-tech-based rich client applications seem to be a trend beginning - Firefox and Chromium implement more and more features to facilitate this) and forbidden for unknown 3-rd party websites (but this would require more complex interaction between a browser and a window manager).
The reason why would I like it is that I want to build a cross-platform (Linux, Windows, Mac), zero-install, fancy-looking rich client application (not meant to be served as an Internet website) with web technologies (like HTML5, CSS3 and JavaScript). I even will probably seek to use some browser-window-less tech to run it (I've heard about Mozilla Prism and XulRunner, KDE and Windows offer to use HTML for desktop widgets, Chromium is meant to offer something alike, etc.)
This is not possible "currently", but there's no technical reason why a browser couldn't provide a proprietary API for this, using non standard html/css/js.
However, that's what it would take, a browser to actually implement this functionality and then expose it as an API, and even then it would be browser specific.
UPDATE (as some people have perhaps misunderstood my answer???):
I'm giving technical context to the question. Of course noone's ever going to implement this, but I'm saying it's technically possible.
Also, doing this would not break the sandbox model. The browser itself (forget an API for a second) could implement transparency any way it wanted. Once it that it could hook it up to it's Javascript engine, and create a stupid call: Chrome.Element("").WeirdTransparency()
UPDATE to Questioner's Update:
to your point:
The reason why would I like it is that
I want to build a cross-platform
(Linux, Windows, Mac), zero-install,
fancy-looking rich client application
(not meant to be served as an Internet
website)
AIR kinda covers 90% or your requirements. It still needs a small install, but apart from that, you're running...
This is possible in Electron. By setting a transparent background on the body.
I'm sure browser developers would need a lot of "inspiration" - aka $$$ to do this. It's currently not a feature that a whole lot of people are looking for.
Since standard compliance is very high on the priority list for all browser developers, making this out of the box would be a problem. Namely because there is no CSS/HTML support for it, and the standard is to have a white background. This means that they would need a custom "flag" somewhere in the markup to tell it to switch off the white background.
This would be exclusive to the browser that implements the "feature" and anyone else using any other browser would not be privy to the it.
Somehow you can get the background image of the desktop, set it your html background, and code any app in it. when you do this concept with active desktop in desktop configuration, I get to see this. ( I maximize the web page and lock it - to make it feel like my desktop )
For getting the background, I am putting the location of that in my PC right now. But I think there should be some programmatic way to do it.
This works for our local desktops. But the idea you are talking about, you definitely require Prism like thing. But Firefox looks like it stopped that project for all. (I keep the dump of it in my PC, though). So Recent users would not have prism even if you guide them to install it on their PCs.
And then, This works if the image is full sized to fit the desktop. Otherwise, We have to repeat it, and the whole desktop looks absurd. I often try to write AIR ( Adobe RIA platform for the Desktops.) apps for my taste of eyes.
I think you should try learning Adobe AIR. In fact, it supports all open technologies. I am not any Adobe employee though :) in case you think I am promoting AIR.

Making Javascript and HTML5 games

A long time ago (Netscape 4-era), I wrote Javascript-based games: Pong, Minesweeper, and John Conway's Life among them. I'm getting back into it, and want to get my hands even dirtier.
I have a few games in mind:
Axis & Allies clone, with rugged maps and complex rules.
Tetris clone, possibly with real-time player-vs-player or player-vs-computer mode
Breakout clone, with a couple weapons and particle velocities
In all of these, I have only a few objectives:
Use JavaScript and HTML 5 - it should run on Chrome, Safari, or maybe an iPad.
Start small and simple, then build-up features.
Learn something new about game design and implementation.
So my questions are:
How would you implement these games?
Do you have any technology recommendations?
If you've written these games, what was the hardest part?
N.B.
I also want to start from first-principles - if you recommend a framework/library, I would appreciate some theory or implementation details behind it. These games are different enough that I should learn something new from each one.
Depends how much you want to start from scratch. To answer your direct questions:
1) How would you implement these games?
A: JavaScript + Canvas. Canvas is the 2D drawing surface from HTML5. Performance is pretty good on desktop machines, not so great on iOS and Android devices (as of the date of this post). If mobile is your utmost concern, you need to use the DOM and CSS3 3D transforms which trigger the GPU on those devices.
2) Do you have any technology recommendations?
A: This is sort of answered by the first question. JavaScript is a must, but I would ignore jQuery. You are targeting HTML5 devices, so no need to compensate for legacy browsers. As you are probably using Canvas, no need to smooth over the DOM interaction, either. There are some higher level libraries which make interacting with Canvas easier, such as Easel.js. WebSockets are useful for bi-directional streaming communication. And Box2D is useful for a physics engine. Local Storage is simple key/value string data for things like level progress, but for anything complex, you'll want WebSQL DB. For large binary assets you'll want to look at the File System API. Finally, don't be afraid of WebGL, as it is extremely fast and useful for 2D games.
3) What is the hardest part?
A: Almost certainly the hardest part is the debugging. WebKit's Developer Tools can make this easier, so don't leave home without them.
Put simply use Canvas for moving lots of stuff around the screen and SVG for prettier, slower, vector graphics.
One of the first things you should do is write a speed test program to see what can be done with Canvas and then play with it.
I wrote a blog post about Canvas & writing HTML5 games
edit 2019-02: processing.js is old and not well supported. Instead, try p5.js, which is equivalent and up to date.
Don't forget processing.js, which is a pretty well tested full-stack graphics and interactivity javascript framework, which has substantial (if not comprehensive) support for most I/O, sounds, graphics, and even WebGL. If you write vanilla Processing code, which is basically Java syntax compiled to JavaScript, you can use many open-source debuggers out there, including the native Processing environment. Other than that, you can integrate any other JavaScript code you have a mind to include.
Here is a guide for the JavaScript developer, explaining much of what you might want to know.
Check it out. Good stuff.
The hardest part, for me, was that there were no tools to help make the graphics, as there is no Maya export to canvas, for example, so, everything is done manually, with primitives, unless you want to take bitmaps that you will modify as though they are sprites.
At the time there was no real support for text in canvas, so my solution didn't work using excanvas, but worked fine on Safari and Firefox.
So, you may want to look at what HTML5 features you want to support, such as a built-in database, and then decide which browsers you are willing to work on.
How to implement these will largely depend on how you want to create the graphics, and if you want to do 3D graphics, as then the bitmapped sprites would not work.
Tom here from Scirra (Construct 2 game maker). We make an HTML5 games engine called Construct 2, it exports purely to HTML5 no Flash in sight!
Construct 2 uses an event based system to add logic to your games and does tons of the repetitive/difficult legwork for you. For example adding polygon collision to objects without some visual editor is a difficult task to undertake sometimes.
Anyway we think it's worth a look and you can get results very quickly from it as well. It's an alternative to coding the entire game you might want to take into consideration when developing HTML5 games.
Take a look at ChromeExperiments The examples are from around the world using the latest open standards, including HTML5, Canvas, SVG, and javascript.
Maybe this is not what you wanted to hear, but have you thought of starting with a good book?
http://www.amazon.com/s/ref=nb_sb_noss_2?url=search-alias%3Daps&field-keywords=html5%20game
A good book will save you a lot of time, and start you off right at the basics.
A good question when I also started to learn HTML5 I also came across this question, finally after lot of research I found best way to do is by using some engine or framework. I learned canvas and made my own game but that took hours of logic and 100+ lines of code.
Better go with scirra, it might reduce your work.
I'm currently working on a series of blog posts explaining how to build a Javascript game using EaselJS and Box2D for physics. Here's Part 1.

3D models on HTML page [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 4 years ago.
Improve this question
I have 3D CAD model that I want to show on a web page. I'd like to show it in a form like a <img> tag (e.g. inline with everything else rather than as a separate page) and I want the visitor to be able to rotate the model to view it from different perspectives.
What options do I have?
Things I'm thinking of/looking at
VRML
3DXML
flash
PDF has something that works but it doesn't embed like I want
3DMLW (Seems very slow)
Universal 3D (supported by Adobe Reader)
Edit:
The model is not very complex so perf is not a major concern.
Chrome Experiments has released several 3D Javascript applications. Here's an example:
Colors Cube
Papervison3D is a 3D flash library which might be worth a look. I haven't had the opportunity to play with it myself, but some of the demos look good.
Papervision and Unity3D are the best choices for the pipeline in and quick loading. Flash is installed on most machined but you need to export as COLLADA format and there is a limit of 2000 polys before it bogs down.
Unity 3D has a great pipeline and is free for the indie now. It supports very high poly counts and the plugin installs without a browser restart and is around 4MB (Flash and Sliverlight are both over 4MB now).
Another option might be Torque 3D but that is also very game based. I think your best option is Unity 3D. You can export as FBX and have it on the web in about 5 minutes.
In the future you could use O3D from Google or WebGL but it is not ready for primetime. The only capable simple pipeline to get 3d on the web currently with decent poly counts is Unity3D. It works on PC and Mac just like Flash and Silverlight.
I am not sure how good flash is at 3d support for things like CAD app file formats. IIRC, flash cannot do hardware accelerated 3D graphics. On the other hand, a Java applet can (with the right library).
A new tool called Sketch Fab came out a few month ago. It's designed entirely in HTML5 and seems very powerful.
You could also look at the <canvas> tag, which is being implemented by more browsers. There is probably already a JavaScript library for model viewing.
Consider QuickTime VR. It allows for much of what you ask and since you have the original, you can create a fairly accurate model.
Unity: http://unity3d.com
Have a look at http://labs.autodesk.com/technologies/freewheel/
Project FreeWheel can show 2D and 3D models made in Autocad, Invertor or Revit. I think it uses DWF or something.
At this point it's not possible to host FreeWheel on your own server, but you can upload a DWF to Autodesk and show your model in an IFrame.
VRML might be a good choice. There's a good client available from Parallel Graphics that I've used for quite a while now. I've got some VRML models on my website (though the content is quite trivial!). The models will load quite quickly, especially if they're not that large. There are several navigation modes available and you can lock it to "examine" which lets the user rotate the model (though in fact it's the camera that's moving around the object).
You will need to find a program that can write VRML files, though any decent modeller will have that option.
Seems like canvas tag based javascript drawing apis are picking up. See this recently released canvas 3d js library, even though it works only in FF 3.5: http://www.c3dl.org/
Autodesk is coming out with their new viewer api:
http://through-the-interface.typepad.com/through_the_interface/webtech/
Shockwave with some scripting code for the user being able to rotate the model.
Here's a JavaScript 3D rendering engine: pre3d.
If you haven't checked it out, Mr. Doob has a library for 3D graphics and modeling: homepage and git repo for three.js.
You could use A3dsViewer - provides export to HTML5(three.js) or you can do directly export to the Google Drive and get the generated <iframe> url for the yours page.
Exported HTML5 models contains by default included rotation functionality.
You can create html file of you 3D model using this plugins. It will generate single html file and you will able to use it any where in your website or you can send it to client as well