Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Edge & Muse

Featured Replies

Hi All, I'm pretty new to Web Design & Development. I've been putting in the effort recently to learn HTML, CSS & JavaScript / JQuery. Just read up about Adobe's new software Edge & Muse. Am I now wasting my time learning these scripting techniques etc, should I learn Edge & Muse?

Errr... if you're looking to work in the web industry, no you shouldn't. The whole point of Muse and Edge is to be able to make websites in modern technologies without having to learn the languages or technical skills involved. It would be like spending months learning to drive, getting your license and then hiring a chauffeur to drive you everywhere.

Hi All, I'm pretty new to Web Design & Development. I've been putting in the effort recently to learn HTML, CSS & JavaScript / JQuery. Just read up about Adobe's new software Edge & Muse. Am I now wasting my time learning these scripting techniques etc, should I learn Edge & Muse?

 

In one word, No.

Hi All, I'm pretty new to Web Design & Development. I've been putting in the effort recently to learn HTML, CSS & JavaScript / JQuery. Just read up about Adobe's new software Edge & Muse. Am I now wasting my time learning these scripting techniques etc, should I learn Edge & Muse?

 

 

the code of Muse and Edge will be horribly "bloated" and thus reducing the overall website efficiency, also if you plan to work in web design and development you NEED to know the background of a webpage, imagine if let's say in an odd event muse were to produce a code bug in one of your clients websites, the client calls you demands to know what's wrong and demands you fix it, what will you do? Say I don't know?, remake the whole website?

 

remember in webdesign there are no simple drag and drop solutions, software can never truly substitute the experience and knowledge of a web designer.

 

The reality is there's not easy 5 minute way to become a quality web designer if there was, none of us would be doing this since we'd not be needed at all if anyone could learn how to make a website over lunch, it takes years of experience, following web trends, reading tutorials, reading blogs, watching presentations etc. etc.

Has anyone here actually used Edge? I'm normally one of the first to jump on the 'no short cuts bandwagon' but I'm forced to face edge because of my dissertation.

 

There were some interesting changes at the top in Adobe towers last year, most notably a man from W3C at the helm. Now if Edge does produce professional code then it's worth a closer look. It's ok saying we shouldn't use it because we might not understand the code but then how many designers use JavaScript (JQuery) libraries and plugins for CMS's.

 

I certainly say people should should learn html5 and css3 but that doesn't mean Edge doesn't have a good use.

 

I'm downloading it now and i'm going to give it a whirl. It might well be pointless but you never know till you try.

Has anyone here actually used Edge? I'm normally one of the first to jump on the 'no short cuts bandwagon' but I'm forced to face edge because of my dissertation.

 

There were some interesting changes at the top in Adobe towers last year, most notably a man from W3C at the helm. Now if Edge does produce professional code then it's worth a closer look. It's ok saying we shouldn't use it because we might not understand the code but then how many designers use JavaScript (JQuery) libraries and plugins for CMS's.

 

I certainly say people should should learn html5 and css3 but that doesn't mean Edge doesn't have a good use.

 

I'm downloading it now and i'm going to give it a whirl. It might well be pointless but you never know till you try.

 

 

......are you kidding?

 

just for jokes I created a div and a heading in edge

 

http://www.bo-ka.si/test/

 

this is the result

 

now let's look @ the folder

t4y1s7.jpg

 

sweet hell what is this? 3 javascripts for a div and a heading saying Lorem Ipsum?

 

now the code

 

<!DOCTYPE html>

<html>

<head>

<meta http-equiv='Content-Type' content='text/html; charset=utf-8'>

<title>Untitled</title>

<!--Adobe Edge Runtime-->

   <script type="text/javascript" charset="utf-8" src="Untitled-1_edgePreload.js"></script>

<!--Adobe Edge Runtime End-->



</head>

<body style="margin:0;padding:0;">

<div id="stage" class="EDGE-3180995">

</div>

</body>

</html>

 

okay the html is not that bad but what is this, it links to a .js ooookay.... let's check that out:

 

/***********************
* Adobe Edge Preloader
*
* Do Not Edit this file
*
***********************/
window.AdobeEdge = window.AdobeEdge || {};
// Include yepnope
if(!AdobeEdge.yepnope) {
/*yepnope1.0.2|WTFPL*/(function(a,b,c){function H(){var a=z;a.loader={load:G,i:0};return a}function G(a,b,c){var e=b=="c"?r:q;i=0,b=b||"j",u(a)?F(e,a,b,this.i++,d,c):(h.splice(this.i++,0,a),h.length==1&&E());return this}function F(a,c,d,g,j,l){function q(){!o&&A(n.readyState)&&(p.r=o=1,!i&&B(),n.onload=n.onreadystatechange=null,e(function(){m.removeChild(n)},0))}var n=b.createElement(a),o=0,p={t:d,s:c,e:l};n.src=n.data=c,!k&&(n.style.display="none"),n.width=n.height="0",a!="object"&&(n.type=d),n.onload=n.onreadystatechange=q,a=="img"?n.onerror=q:a=="script"&&(n.onerror=function(){p.e=p.r=1,E()}),h.splice(g,0,p),m.insertBefore(n,k?null:f),e(function(){o||(m.removeChild(n),p.r=p.e=o=1,B())},z.errorTimeout)}function E(){var a=h.shift();i=1,a?a.t?e(function(){a.t=="c"?D(a):C(a)},0):(a(),B()):i=0}function D(a){var c=b.createElement("link"),d;c.href=a.s,c.rel="stylesheet",c.type="text/css";if(!a.e&&(o||j)){var g=function(a){e(function(){if(!d)try{a.sheet.cssRules.length?(d=1,B()):g(a)}catch({b.code==1e3||b.message=="security"||b.message=="denied"?(d=1,e(function(){B()},0)):g(a)}},0)};g(c)}else c.onload=function(){d||(d=1,e(function(){B()},0))},a.e&&c.onload();e(function(){d||(d=1,B())},z.errorTimeout),!a.e&&f.parentNode.insertBefore(c,f)}function C(a){var c=b.createElement("script"),d;c.src=a.s,c.onreadystatechange=c.onload=function(){!d&&A(c.readyState)&&(d=1,B(),c.onload=c.onreadystatechange=null)},e(function(){d||(d=1,B())},z.errorTimeout),a.e?c.onload():f.parentNode.insertBefore(c,f)}function B(){var a=1,b=-1;while(h.length- ++b)if(h[b].s&&!(a=h[b].r))break;a&&E()}function A(a){return!a||a=="loaded"||a=="complete"}var d=b.documentElement,e=a.setTimeout,f=b.getElementsByTagName("script")[0],g={}.toString,h=[],i=0,j="MozAppearance"in d.style,k=j&&!!b.createRange().compareNode,l=j&&!k,m=k?d:f.parentNode,n=a.opera&&g.call(a.opera)=="[object Opera]",o="webkitAppearance"in d.style,p=o&&"async"in b.createElement("script"),q=j?"object":n||p?"img":"script",r=o?"img":q,s=Array.isArray||function(a){return g.call(a)=="[object Array]"},t=function(a){return Object(a)===a},u=function(a){return typeof a=="string"},v=function(a){return g.call(a)=="[object Function]"},w=[],x={},y,z;z=function(a){function h(a,{function i(a){if(u(a))g(a,f,b,0,c);else if(t(a))for(h in a)a.hasOwnProperty(h)&&g(a[h],f,b,h,c)}var c=!!a.test,d=c?a.yep:a.nope,e=a.load||a.both,f=a.callback,h;i(d),i(e),a.complete&&b.load(a.complete)}function g(a,b,d,e,g){var h=f(a),i=h.autoCallback;if(!h.bypass){b&&(b=v(?b:b[a]||b[e]||b[a.split("/").pop().split("?")[0]]);if(h.instead)return h.instead(a,b,d,e,g);d.load(h.url,h.forceCSS||!h.forceJS&&/css$/.test(h.url)?"c":c,h.noexec),(v(||v(i))&&d.load(function(){H(),b&&b(h.origUrl,g,e),i&&i(h.origUrl,g,e)})}}function f(a){var b=a.split("!"),c=w.length,d=b.pop(),e=b.length,f={url:d,origUrl:d,prefixes:b},g,h;for(h=0;h<e;h++)g=x[b[h]],g&&(f=g(f));for(h=0;h<c;h++)f=w[h](f);return f}var b,d,e=this.yepnope.loader;if(u(a))g(a,0,e,0);else if(s(a))for(b=0;b<a.length;b++)d=a[b],u(d)?g(d,0,e,0):s(d)?z(d):t(d)&&h(d,e);else t(a)&&h(a,e)},z.addPrefix=function(a,{x[a]=b},z.addFilter=function(a){w.push(a)},z.errorTimeout=1e4,b.readyState==null&&b.addEventListener&&(b.readyState="loading",b.addEventListener("DOMContentLoaded",y=function(){b.removeEventListener("DOMContentLoaded",y,0),b.readyState="complete"},0)),a.yepnope=H()})(this,this.document);
AdobeEdge.yepnope = window.yepnope;
}
// end yepnope
(function(compId){
   function onDocLoaded(e) {
       window.AdobeEdge.loaded = true;
   }

   if ( document.addEventListener ) {
       window.addEventListener( "load", onDocLoaded, false );
   } else if ( document.attachEvent ) {
       window.attachEvent( "onload", onDocLoaded );
   }
   var testEle = document.createElement('div');
   function isSupported(props) {
       var s = testEle.style, p;
       for(i= 0; i < props.length; i++) {
           p = props[i];
           if(s[p] !== undefined){
               return true;
           }
       }
       return false;
   }
   var hasTransform = isSupported(['transformProperty', 'WebkitTransform', 'MozTransform', 'OTransform', 'msTransform']);

   function edgeCallback(url, result, key) {
   	AdobeEdge.preload.got[url] = true;
   	if(url == AdobeEdge.preload.last) {
   		AdobeEdge.okToLaunchComposition(compId);
   		AdobeEdge.preload.busy =  false;
    	if(AdobeEdge.preload.q.length > 0){
    		var req = AdobeEdge.preload.q.pop();
    		AdobeEdge.requestResources(req.files, req.callback);
    	}
	}
}
   AdobeEdge.requestResources = AdobeEdge.requestResources || function(files, cb) {
    	AdobeEdge.preload.busy =  true;
  		AdobeEdge.preload.got = AdobeEdge.preload.got || {};
   	var i, f, len = files.length, a = [];
   	for (i = 0; i < len; i++ ) {
   		url = files[i];
   		if( !AdobeEdge.preload.got[url] ) {
   			a.push(url);
   			AdobeEdge.preload.last = url;
   		}
   	}
	if(a.length) {
		AdobeEdge.yepnope({load: a, callback: cb});
	}
   }

   function loadResources(files) {
   	AdobeEdge.preload = AdobeEdge.preload || [];
   	AdobeEdge.preload.q = AdobeEdge.preload.q || [];
   	if( !AdobeEdge.preload.busy ){
   		AdobeEdge.requestResources(files, edgeCallback);
   	} else {
   		AdobeEdge.preload.q.push({files: files, callback: edgeCallback});
   	}
   }

   loadResources([    "edge_includes/jquery-1.6.2.min.js",
   "edge_includes/jquery.easing.1.3.js",
   "edge_includes/edge.0.1.4.min.js",
   "Untitled-1_edge.js",
   "Untitled-1_edgeActions.js"]);

})( "EDGE-3180995");

 

 

so much javascript, just for a div and lorem ipsum....

 

 

not to mention I had no way of setting the div width to 100% inside the actual software and a lot of missing things.

 

Now I know Edge is supposed to be for animating websites and making them interactive BUT the amount of .js it produces is incredible, I guess it would work okay on a small scale site, but anything on a medium to large scale would load too slow and destroy all hopes of making your work responsive and fluent.

 

There's also the problem of the client calling you up in the middle of the night to tell you he/she found a bug and demands to have it fixed, what do you do? re-create the site or spend 5h searching for that one bug in the most unclean code imaginable?

It might well be pointless but you never know till you try.

 

......are you kidding?

 

 

Well as WBC stated, "You never know till you try"... in this case you had tried so you knew.

Once WBC has tried it i'm sure he'll come to the same conclusion.

However, looking at what you've posted, i'm not even going to bother trying it :p

Well as WBC stated, "You never know till you try"... in this case you had tried so you knew.

Once WBC has tried it i'm sure he'll come to the same conclusion.

However, looking at what you've posted, i'm not even going to bother trying it :p

 

I expected some off code at the most but when I checked the folder contents and saw not one but 3 javascripts for a lorem ipsum in a div that was when my jaw hit the floor,

 

now doing the same for muse:

 

So first this is the site:

 

http://www.bo-ka.si/muse/

 

Horrible I know....

 

here's the folder view:

 

14t3kmd.png

 

a lot going on here

1) it saved the text as an image file

2) it created 2 CSS scripts

3) let's explore the scripts folder

 

2j0js5x.png

 

4 javascripts? for lorem ipsum in a grey div?

 

SO I think to myself well....at least the code can't be THAT bad

 

it is....

 

HTML

<!DOCTYPE html>
<html>
<head>

 <meta http-equiv="Content-type" content="text/html;charset=UTF-8"/>
 <meta name="generator" content="0.8.792.106"/>
 <title>Home</title>
 <!-- CSS -->
 <link rel="stylesheet" type="text/css" href="css/site_global.css?4291187007"/>
 <link rel="stylesheet" type="text/css" href="css/index.css?324910995"/>
 <!-- Other scripts -->
 <script type="text/javascript">
  document.documentElement.className = 'js';
</script>
  </head>
<body>

 <div class="clearfix" id="page"><!-- column -->
  <div class="clearfix colelem" id="u70"><!-- group -->
   <div class="grpelem" id="u71-4"><!-- rasterized frame -->
    <img id="u71-4_img" src="image/index_u71-4.png" alt="Lorem ipsum" width="273" height="45"/>
   </div>
  </div>
 </div>
 <!-- JS includes -->
 <script src="http://musecdn.businesscatalyst.com/scripts/1.1/jquery-1.7.min.js" type="text/javascript"></script>
 <script type="text/javascript">
  window.jQuery || document.write('\x3Cscript src="scripts/1.1/jquery-1.7.min.js" type="text/javascript">\x3C/script>');
</script>
 <script src="scripts/1.1/sprydomutils.js?119034094" type="text/javascript"></script>
 <script src="scripts/1.1/museutils.js?66334222" type="text/javascript"></script>
 <!-- Other scripts -->
 <script type="text/javascript">
  Muse.Utils.addSelectorFn('body', Muse.Utils.transformMarkupToFixBrowserProblemsPreInit);/* body */
Muse.Utils.addSelectorFn('a.nonblock', Muse.Utils.addHyperlinkAnchor); /* a.nonblock */
Muse.Utils.addSelectorFn('body', Muse.Utils.showWidgetsWhenReady);/* body */
Muse.Utils.addSelectorFn('body', Muse.Utils.transformMarkupToFixBrowserProblems);/* body */

</script>
  </body>
</html>

 

 

CSS1

html
{
min-height: 100%;
min-width: 100%;
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td,a
{
margin: 0;
padding: 0;
border-width: 0;
}

table
{
border-collapse: collapse;
border-spacing: 0;
}

fieldset,img
{
border: 0;
}

address,caption,cite,code,dfn,em,strong,th,var,optgroup
{
font-style: inherit;
font-weight: inherit;
}

del,ins
{
text-decoration: none;
}

li
{
list-style: none;
}

caption,th
{
text-align: left;
}

h1,h2,h3,h4,h5,h6
{
font-size: 100%;
font-weight: inherit;
}

input,button,textarea,select,optgroup,option
{
font-family: inherit;
font-size: inherit;
font-style: inherit;
font-weight: inherit;
}

body
{
font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
text-align: left;
font-size: 14px;
line-height: 1.2;
word-wrap: break-word;
text-rendering: optimizeLegibility;/* kerning, primarily */
}

@media screen and (-webkit-min-device-pixel-ratio:0)
{
body { text-rendering:auto; }
}

a:link
{
color: #0000FF;
visibility: inherit;
text-decoration: underline;
}

a:visited
{
color: #800080;
visibility: inherit;
text-decoration: underline;
}

a:hover
{
color: #0000FF;
visibility: inherit;
text-decoration: underline;
}

a:active
{
color: #EE0000;
visibility: inherit;
text-decoration: underline;
}

a.nontext /* used to override default properties of 'a' tag */
{
text-decoration: none;
color: black;
}

.TabbedPanelsTab
{
white-space: nowrap;
}

.MenuBar  .MenuBarView, .MenuBar  .SubMenuView /* Resets for ul and li in menus */
{
display: block;
list-style: none;
}

.MenuBar .SubMenu
{
display: none;
position: absolute;
}

.NoWrap
{
white-space: nowrap;
word-wrap: normal;
}

.MenuBar .MenuItemContainer
{
position: relative;
}

.rootelem /* the root of the artwork tree */
{
margin-left: auto;
margin-right: auto;
}

.colelem /* a child element of a column */
{
display: inline;
float: left;
clear: both;
}

.grpelem /* a child element of a group */
{
display: inline;
float: left;
}

.clearfix:after /* force a container to fit around floated items */
{
content: "\0020";
visibility: hidden;
display: block;
height: 0;
clear: both;
}

*:first-child+html .clearfix /* IE7 */
{
zoom: 1;
}

.inclusion_context /* context for positioning a group of elements that share the same height */
{
display: table;
table-layout: fixed;
width: 0.01px;
}

.inclelem /* element of an inclusion context */
{
display: table-cell;
vertical-align: top;
}

.f3s_mid /* 3-slice frame, middle slice */
{
background-repeat: repeat;
}

.f3s_top, .f3s_bot /* 3-slice frame, top slice */
{
background-repeat: no-repeat;
}

.f9s_top_left, .f9s_bot_left /* 9-slice frame, left corner slice */
{
background-repeat: no-repeat;
background-position: left;
}

.f9s_top_right, .f9s_bot_right /* 9-slice frame, right corner slice */
{
background-repeat: no-repeat;
background-position: right;
}

.f9s_top_mid, .f9s_bot_mid /* 9-slice frame, top/bottom horizontal slice */
{
background-repeat: repeat-x;
background-position: 0px 0px;
}

.f9s_mid_left /* 9-slice frame, left vertical slice */
{
background-repeat: repeat-y;
background-position: left;
}

.f9s_mid_right /* 9-slice frame, right vertical slice */
{
background-repeat: repeat-y;
background-position: right;
}

.f9s_center /* 9-slice frame, center slice */
{
background-repeat: repeat;
background-position: 0px 0px;
}

.popup_anchor /* anchors an abspos popup */
{
position: relative;
width: 0px;
height: 0px;
}

.popup_element
{
z-index: 100000;
}

.pointer_cursor
{
cursor: pointer;
}

span.wrap /* used to force wrap after floated array when nested inside a paragraph */
{
content: '';
clear: left;
display: block;
}

span.actAsInlineDiv /* used to simulate a DIV with inline display when already nested inside a paragraph */
{
display: inline-block;
}

.position_content, .excludeFromNormalFlow /* used when child content is larger than parent */
{
float: left;
}

.preload_images /* used to preload images used in non-defaul states */
{
position: absolute;
overflow: hidden;
left: -9999px;
top: -9999px;
height: 1px;
width: 1px;
}

preload /* used to specifiy the dimension of preload item */
{
height: 1px;
width: 1px;
}

.animateStates
{
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}

.anchor_item /* used to specify anchor properties */
{
width: 22px;
height: 18px;
}

.MenuBar .SubMenuVisible, .MenuBarVertical .SubMenuVisible, .MenuBar .SubMenu .SubMenuVisible, .popup_element.Active, span.actAsPara, .actAsDiv, a.nonblock.nontext
{
display: block;
}

.popup_element.Inactive, .js .disn
{
display: none;
}

.widget_invisible, .js .invi /* used to hide the widget before loaded */
{
visibility: hidden;
}

 

CSS2

html
{
background-color: #7F7F7F;
}

#page
{
z-index: 1;
width: 920px;
min-height: 43px;
border-width: 1px;
border-style: solid;
border-color: #000000;
background-color: #FFFFFF;
margin: 35px auto 36px;
padding: 20px 20px 437px;
}

#u70
{
z-index: 2;
width: 919px;
border-width: 1px;
border-style: solid;
border-color: #000000;
background-color: #4A4A4A;
left: -1px;
position: relative;
}

#u71-4
{
z-index: 3;
margin-bottom: -9px;
position: relative;
width: 273px;
margin-right: -273px;
margin-top: 5px;
left: 2px;
}

#u71-4_img
{
display: block;
vertical-align: top;
}

 

I'm not even gonna copy the scripts.

 

So there you have it....That's what muse does to the code.....

Edited by D.Schuster

Just goes to prove that computer software can't implement or even mimic the common sense intuitive coding of a decent web professional.

 

Now how to explain this to the general public hmmmm....

Just goes to prove that computer software can't implement or even mimic the common sense intuitive coding of a decent web professional.

 

Now how to explain this to the general public hmmmm....

 

I fully agree with Mike.

 

as for explaining to the general public.

Hmm that'll be hard to do, also fact is every person just getting into the area of web development and design will look for short cuts and easy ways in, a sort of drag and drop software, let's face it learning code IS indeed a chore, but a necessary one....That is why whenever I hear of a software that promises professional result without touching the code, I simply roll my eyes and move on.

Edited by D.Schuster

Erm, just to defend it a bit here.

 

Who in their right mind would use it for a couple of DIVs? Nobody.

 

Edge is for creating animation, so the likelihood is those are just default styles and scripts which are loaded the second you start a new project. I would imagine if you are creating complex animations using Edge, you may be grateful not having to repeatedly code the same basic code to get it started.

 

Doesn't prove it to be bloated in the slightest.

 

Come on, let's be fair here and at least approach criticism in a logical manner...!

Edited by brightonmike

Erm, just to defend it a bit here.

 

Who in their right mind would use it for a couple of DIVs? Nobody.

 

Edge is for creating animation, so the likelihood is those are just default styles and scripts which are loaded the second you start a new project. I would imagine if you are creating complex animations using Edge, you may be grateful not having to repeatedly code the same basic code to get it started.

 

Doesn't prove it to be bloated in the slightest.

 

Come on, let's be fair here and at least approach criticism in a logical manner...!

 

That might be the case but imagine you're trying to put together a simplistic site with the most modern animations , a minimalistic yet animated site, that only involves a couple of divs and some text, but you want it to let's say fade in section by section, you COULD make that yourself with a few simple lines of code.. OR have edge produce this mess... with the same result.

 

This would be the self made code

<script LANGUAGE="JavaScript"> 
function fadeInPage()
{ 
if(document.getElementById("fadeDiv").filters("alpha").opacity < 100)
{ 
 document.getElementById("fadeDiv").filters("alpha").opacity += 10; 
 setTimeout("fadeInPage()",100); 
} 
else
{ 
 document.getElementById('fadeDiv').style.visibility = "visible";
} 
} 
</script> 
</head> 

<body onLoad="fadeInPage()">

 

you could divide this into sections and delay them

 

this is what edge did for a single div fade in on load

/**
* Adobe Edge: symbol definitions
*/
(function($, Edge, compId){
var fonts = {
};
var symbols = {
"stage": {
  version: "0.1.4",
  baseState: "Base State",
  initialState: "Base State",
  gpuAccelerate: true,
  content: {
     dom: [
       {
           id:'Symbol_1',
           type:'rect',
           rect:[0,0,0,0]
       }],
     symbolInstances: [
     {
        id:'Symbol_1',
        symbolName:'Symbol 1'
     }
     ]
  },
  states: {
     "Base State": {
        "${_stage}": [
           ["color", "background-color", 'rgba(255,255,255,1)'],
           ["style", "height", '400px'],
           ["style", "width", '550px']
        ],
        "${_Symbol_1}": [
           ["style", "opacity", '0']
        ]
     }
  },
  timelines: {
     "Default Timeline": {
        fromState: "Base State",
        toState: "",
        duration: 370,
        autoPlay: true,
        labels: {

        },
        timeline: [
           { id: "eid4", tween: [ "style", "${_Symbol_1}", "opacity", '1', { fromValue: '0'}], position: 0, duration: 370 }         ]
     }
  }
},
"Symbol 1": {
  version: "0.1.4",
  baseState: "Base State",
  initialState: "Base State",
  gpuAccelerate: true,
  content: {
  dom: [
  {
      id:'Rectangle',
      type:'rect',
      rect:[2,-33,550,64],
      fill:['rgba(192,192,192,1)',null],
      stroke:[0,"rgba(0,0,0,1)","none"],
      transform:[[-2,33],[0,0],[0],[1,1]]
  }],
  symbolInstances: [

  ]
},
  states: {
     "Base State": {
        "${symbolSelector}": [
           ["style", "height", '64px'],
           ["style", "width", '550px']
        ],
        "${_Rectangle}": [
           ["style", "height", '64px'],
           ["transform", "translateY", '33px'],
           ["transform", "translateX", '-2px']
        ]
     }
  },
  timelines: {
     "Default Timeline": {
        fromState: "Base State",
        toState: "",
        duration: 370,
        autoPlay: true,
        labels: {

        },
        timeline: [
        ]
     }
  }
}
};

Edge.registerCompositionDefn(compId, symbols, fonts);

/**
* Adobe Edge DOM Ready Event Handler
*/
$(window).ready(function() {
    Edge.launchComposition(compId);
});
})(jQuery, AdobeEdge, "EDGE-10974139");

 

And no....I can not remove one bit of code without messing the whole thing up...

snip

 

 

DUDE

 

You wouldn't use it for something that simple. It's not meant for making a DIV fade in.

 

It's meant for creating more complex animations that, to code by hand, would take days and days and days and be extremely difficult.

 

That is why the code is "bloated".

 

You're not even using it for it's intended purpose, so your critique of it is completely void.

 

 

Edit. Some examples of it's actual, intended use:

 

http://labs.adobe.com/technologies/edge/resources/shadow/shadow.html

 

http://labs.adobe.com/technologies/edge/resources/maxdemo/MaxComplete.html

 

http://labs.adobe.com/technologies/edge/resources/egg/index.html

 

I do not believe any of them are bloated.

 

I don't believe either, that I could have achieved the same, by hand, in a reasonable length of time,

Edited by brightonmike

DUDE

 

You wouldn't use it for something that simple. It's not meant for making a DIV fade in.

 

It's meant for creating more complex animations that, to code by hand, would take days and days and days and be extremely difficult.

 

That is why the code is "bloated".

 

You're not even using it for it's intended purpose, so your critique of it is completely void.

 

 

Edit. Some examples of it's actual, intended use:

 

http://labs.adobe.com/technologies/edge/resources/shadow/shadow.html

 

http://labs.adobe.com/technologies/edge/resources/maxdemo/MaxComplete.html

 

http://labs.adobe.com/technologies/edge/resources/egg/index.html

 

I do not believe any of them are bloated.

 

I don't believe either, that I could have achieved the same, by hand, in a reasonable length of time,

 

then you need to look into some stuff they're doing with CSS3 and HTML5

 

http://9elements.com/io/projects/html5/canvas/

http://mrdoob.com/projects/chromeexperiments/ball_pool/

http://bomomo.com/

http://www.addyosmani.com/resources/canvasphoto/

http://dan.forys.co.uk/experiments/mesmerizer/

http://www.professorcloud.com/mainsite/canvas-nebula.htm

http://tomtheisen.com/spread/

 

Especially:

http://www.chiptune.com/starfield/starfield.html

http://peterned.home.xs4all.nl/3d/

http://andrew-hoyer.com/andrewhoyer/experiments/cloth/

http://deanm.github.com/pre3d/monster.html

http://smalltalkapp.com/#all

http://alteredqualia.com/cubeout/

 

 

none of these were coded by edge/muse or flash, all hand coded, so frankly I don't see your point?

 

also all of your links are from adobe labs.....ofc they're not going to display how bad their own product is.....

then you need to look into some stuff they're doing with CSS3 and HTML5

 

http://9elements.com/io/projects/html5/canvas/

http://mrdoob.com/projects/chromeexperiments/ball_pool/

http://bomomo.com/

http://www.addyosmani.com/resources/canvasphoto/

http://dan.forys.co.uk/experiments/mesmerizer/

http://www.professorcloud.com/mainsite/canvas-nebula.htm

http://tomtheisen.com/spread/

 

Especially:

http://www.chiptune.com/starfield/starfield.html

http://peterned.home.xs4all.nl/3d/

http://andrew-hoyer.com/andrewhoyer/experiments/cloth/

http://deanm.github.com/pre3d/monster.html

http://smalltalkapp.com/#all

http://alteredqualia.com/cubeout/

 

 

none of these were coded by edge/muse or flash, all hand coded, so frankly I don't see your point?

 

also all of your links are from adobe labs.....ofc they're not going to display how bad their own product is.....

 

 

My point is, Edge potentially makes it easier and quicker to create complex animations. It is not for making DIVs fade, and it's not for creating basic HTML pages. They were unfair criticisms.

 

Can you still hand code those animations? Of course. I wasn't born last year, I'm well up to date with what's possible using Canvas in particular.

 

But it takes a huge amount of time to do so. Anything remotely complex, such as the above, would have taken a long time to develop. Possibly weeks.

 

Edge gives us the possibility to produce similar results, much quicker. That doesn't mean to say it's going to be the solution for everyone. It doesn't mean to say it will produce the better code, or even good code at all. I'm not assuming anything here, I am simply pointing out what Edge is intended to be used for, and why it could, potentially, be advantageous.

 

Not only that, but Edge is an open, genuine attempt by Adobe to kill off Flash. Edge opens possibilities to create complex browser-games that run on all devices.

 

Personally, I think it is a good start. I don't know if Edge is the long term solution, but it's a beginning, and a genuine one.

 

I think it is extremely important all developers approach a tool like Edge with an open mind, and critique it on the basis of what it was intended to be used for. Neither seem to apply in this thread, which is a shame IMO.

My point is, Edge potentially makes it easier and quicker to create complex animations. It is not for making DIVs fade, and it's not for creating basic HTML pages. They were unfair criticisms.

 

Can you still hand code those animations? Of course. I wasn't born last year, I'm well up to date with what's possible using Canvas in particular.

 

But it takes a huge amount of time to do so. Anything remotely complex, such as the above, would have taken a long time to develop. Possibly weeks.

 

Edge gives us the possibility to produce similar results, much quicker. That doesn't mean to say it's going to be the solution for everyone. It doesn't mean to say it will produce the better code, or even good code at all. I'm not assuming anything here, I am simply pointing out what Edge is intended to be used for, and why it could, potentially, be advantageous.

 

Not only that, but Edge is an open, genuine attempt by Adobe to kill off Flash. Edge opens possibilities to create complex browser-games that run on all devices.

 

Personally, I think it is a good start. I don't know if Edge is the long term solution, but it's a beginning, and a genuine one.

 

I think it is extremely important all developers approach a tool like Edge with an open mind, and critique it on the basis of what it was intended to be used for. Neither seem to apply in this thread, which is a shame IMO.

 

 

but do we need a software that will mimic flash animation is CSS and javascript, we need to know that there are sites that rely heavily on animation more than content sites that need to be visual and "cool" game sites usually, they usually involve video, audio etc. now if we don't mind risking cross browser computability we can create similar results with CSS3 and HTML5, no problem in that, the problem however IS that browsers that support CSS3 and HTML5 as they should are a minority, while with flash all our users need is a simple plug-in and they can continue using the browser they personally like.

 

not only that but websites that rely heavily on flash won't be quite eager to switch over to CSS and javascript any time soon, that is because the CSS that is compatible with every major browser at the time is just not as good as flash at animation, quite the opposite it's pretty basic.

 

Now using an adobe app to create basic css and javascript animation seems a bit of an overkill to me, like opening up coconuts with dynamite.

 

CSS and Javascript should not always replace flash, and I'm sorry to say this flash will not die out quite as quickly, for now we still need it...

 

 

Also I fear that once this is fully released people will go just as crazy as they did with adobe flash, adding pointless animation just for the sake of it being there not related to content in anyway.

 

 

 

P.S ......Don't call me dude....

Edited by D.Schuster

I have to whole heartedly disagree with you here BM.

 

Yes, obviously the software is designed to produce far more than a single DIV site BUT if it can't even intelligently work out when all the bloat is not needed on such a small scale, how is it going to fair on the larger scale?

 

What about Muse? it's code was just as bad.

 

At the end of the day the software is just not intelligent enough to make the choice between what is needed and what is bloat and that is always going to be its downfall. A better test would be to create two largish sites with the full works. One in Edge and one by hand. Now i'm guessing using Edge will be a lot faster but the one by hand (so long as you know what you're doing) will be far more professional, using less code and a smarter way of reaching the same goal.

 

We don't need another bloated piece of crap software clogging up the internet. I appreciate Adobe is a business but as far as i'm concerned, these two products are dead in the water as far simpler IDE's or frameworks will come along that just do it better (all be it with a bit more work needed).

Edited by MikeChipshop

I think it's worth having an open mind.

 

I'm not saying Edge, in its current form, is the solution. But I do feel it's a step in the right direction.

 

I think it has potential. If it can produce clean, good code.

 

Also, if we are to produce Flash, it simply cannot be hand-written code. There has to exist a tool that allows people to visually create games and animations. Otherwise, Flash will never die.

Hoping someone will come in and agree with me lol.

 

I can't be the only one that thinks this is a good step in the right direction towards killing off flash.

......are you kidding?

 

just for jokes I created a div and a heading in edge

 

 

No I wasn't kidding, the journey of researching for my dissertation wouldn't be complete without looking at these hybrid solutions, so when I look at it it's not just for jokes it's in a logical academic manner. To just write off without investigation would invalidate all my work.

 

Good debate some interesting points made. I agree with BMike it could be useful for complex animations, saving time and money and what else do companies what, as long as the tool can aid productivity I doubt many companies will care about bloated code. This isn't a good thing but it is already done in many different ways throughout the industry.

 

How much of a problem is bloated code if the code belongs to an animation that if it wasn't for Edge wouldn't have been made anyway? Just like most of us thought or think using Flash for parts of the site is ok but a full Flash site is a no, maybe Edge has its place or is a catalyst for something better down the road.

 

Nobody complains about Illustrator creating bloated vectors and that people shouldn't take short cuts but should script vector files.

 

Thanks for the replies Dudes.

No I wasn't kidding, the journey of researching for my dissertation wouldn't be complete without looking at these hybrid solutions, so when I look at it it's not just for jokes it's in a logical academic manner. To just write off without investigation would invalidate all my work.

 

Good debate some interesting points made. I agree with BMike it could be useful for complex animations, saving time and money and what else do companies what, as long as the tool can aid productivity I doubt many companies will care about bloated code. This isn't a good thing but it is already done in many different ways throughout the industry.

 

How much of a problem is bloated code if the code belongs to an animation that if it wasn't for Edge wouldn't have been made anyway? Just like most of us thought or think using Flash for parts of the site is ok but a full Flash site is a no, maybe Edge has its place or is a catalyst for something better down the road.

 

Nobody complains about Illustrator creating bloated vectors and that people shouldn't take short cuts but should script vector files.

 

Thanks for the replies Dudes.

 

 

Companies might not care for bloated code, they will however care for website speed and how quickly the website responds but no they will not care for bloated code, you know why? cause that's your duty and responsibly as a web designer, to provide them with your personal expertise and human knowledge on how to tackle their web presentation of their company.

 

that's why they hire us.

 

Let's look at it like this, you create a website in muse, you animate it in Edge, the client pays you for as littler of your work as possible, he calls you up demands you fix a bug, you don't know how to fix said bug, client finds someone who can, he looks at the existing source code of the website YOU charged your previous client for, tells them they just payed a fortune for little work(I would) offers them a full website rebuild hand coded and throws in a couple of years of all bug fixes or else money back, he gets YOUR client, and the client will not happily spread the word on the horrible service he got and since freelancers rely most on oral marketing, you start slowly loosing clients more and more and more until there are none that want to hire you.

 

trust me web designers like me and so many others are just WAITING to get a client like that, with a website previously made by someone who used software generated code and not for a second will we hesitate to explain to the customer why we think he's been "scammed"

 

 

 

@BM:

 

You fight for a noble cause my friend, the death of flash is much anticipated by all in this field, CSS3 and HTML5 are doing the right thing, Edge however is the wrong tool for the wrong job.

 

So, a small step in the direction of not killing but more ...replacing flash.

 

We will kill flash when we finally explain to the public WHY it's just not good at all.

Edited by D.Schuster

Don't use anything from Adobe. It will only encourage them.

 

...Bit extreme isn't it, I mean it's not like the CEO of adobe plays with his stereotypical villain thin moustache every time and adobe product is used "Haaa Ha! I have fooled them into making their job easier with tools like Photoshop, Dreamweaver and Premier pro, now I shall use the money I gained and invest into flash more Haa HA! that'll show them"

 

No, no, most Adobe products are actually really good, this however is a step in the wrong direction, adobe REALLY needs to stop trying to invent "codeless software".

Edited by D.Schuster

Don't use anything from Adobe.

 

I use Photoshop and Illustrator regularly and they suit me just fine. Don't bother with Dreamweaver so much though.

 

This is supposed to be good too

 

shadow

 

/end digress

Edited by oakleaves

Would I use edge this for a site? Doubtful.

But this isn’t really about what I’d do; I need to be objective when writing academically.

 

People using JQuery libraries could end up in the same situation as you describe, but no one frowns on their use or condemns designers for using them.

 

Lots of front end designer use PHP forms yet have no idea how they work and again could end up in the same situation. As long as you sell what you are making correctly none of that is a real issue. And with no facts to back up how an animation’s bloated code with slow down a web page it’s hard to say if that is always an issue. Like back with flash a lot of clients didn’t want the facts they just wanted a flash site no matter how long it took to load.

 

We may not like it but that doesn’t mean it doesn’t have a place.

No, no, most Adobe products are actually really good, this however is a step in the wrong direction, adobe REALLY needs to stop trying to invent "codeless software".

 

This. Also ditch Design View from Dreamweaver and you've got a reasonable editor. Of course mine's better, but anyone'll say that about their IDE of choice.

Would I use edge this for a site? Doubtful.

But this isn’t really about what I’d do; I need to be objective when writing academically.

 

People using JQuery libraries could end up in the same situation as you describe, but no one frowns on their use or condemns designers for using them.

 

Lots of front end designer use PHP forms yet have no idea how they work and again could end up in the same situation. As long as you sell what you are making correctly none of that is a real issue. And with no facts to back up how an animation’s bloated code with slow down a web page it’s hard to say if that is always an issue. Like back with flash a lot of clients didn’t want the facts they just wanted a flash site no matter how long it took to load.

 

We may not like it but that doesn’t mean it doesn’t have a place.

 

 

....Did you just totally ignore everything I wrote?

Clients not caring on load times? ....do tell me where your clients come from I'd love to have some of those easy going chaps hiring me, fact is software generated code will spring bugs, finding them is hard near impossible even, since more often then not such software generates codes that somehow depend on each other, clear one line and you got your whole site out of proportion, so I repeat, use software like this especially as unrefined as edge and muse currently are and you will loose clients and make a bad name for yourself.

 

Don't think clients hire just anyone, they search, they ask around, they search some more, they find someone, do a background check, ask around about him etc.

 

and don't think we the other web designers/developers will hesitate for a second to convince your previous clients they overpaid, the minute we see any machine generated code, I'd do it and pretty much anyone else would.

 

I can not imagine a scenario in which the adobe edge/muse method would me more a more suitable choice then human hand coding.

 

 

 

This. Also ditch Design View from Dreamweaver and you've got a reasonable editor. Of course mine's better, but anyone'll say that about their IDE of choice.

 

Thank you :) and I fully agree, altho I seem to be using Aptana a whole lot more lately, feels faster for some reason.

Edited by D.Schuster

No I read what you put.

You seem to be taking this personally, this has nothign to do with my clients.

There are lots of flash sites that take time to load.

I'd love to see a site made with an edge animation to see how fast it loads.

Edited by WBC

fact is software generated code will spring bugs, finding them is hard near impossible even, since more often then not such software generates codes

 

 

Everything you do on a computer involves software generating code. You are basically using the way computers work as an argument against Edge.

 

I'm not saying Edge gets it right, but whether you use an IDE or a WYSIWYG, there is software that generates the code for you.

 

Pointless trying to avoid that unless you fancy getting to grips with Assembly.

Everything you do on a computer involves software generating code. You are basically using the way computers work as an argument against Edge.

 

I'm not saying Edge gets it right, but whether you use an IDE or a WYSIWYG, there is software that generates the code for you.

 

Pointless trying to avoid that unless you fancy getting to grips with Assembly.

 

No, YOU are wrong!

I'm the most wrong here.

 

I saw the title and thought it was going to be a thread about the guitarist from U2 making a guest appearance on Matt Bellamy etc.'s new album.

 

I'll get me coat.

I saw the title and thought it was going to be a thread about the guitarist from U2 making a guest appearance on Matt Bellamy etc.'s new album.

 

Likewise. Not sure what that says about my knowledge of technology.

 

Says a lot about our knowledge of music though! :drinks:

If people disagree about things in this thread can you all at least try to do it in a grown up manner and back up your disagreement with evidence and facts.

 

My childish comment was childish for a reason, it was sarcasm, like if I said well my dad can beat up your dad....but I won't cause my dad is dead...... Anyway it's my way of saying I'm done with this, let's have a laugh about it.

People used to say the same thing about dreamweaver. They said "don't use Dreamweaver, it produces horrible code", but when you actually use the software as a editor and don't use the "design view", The only "bloated code" in it is the code you put in there yourself.

I have used Muse, and while I think it's a junk program Im not going to talk about it other than saying that.

 

If you plan on doing web development, especially as a full time job for someone (as opposed to freelance), then there is no way around it, you must know code. If you are freelancing you can get around it... but honestly it is much better to understand the code because it is your craft and you should understand the code.

 

That is all.

People used to say the same thing about dreamweaver. They said "don't use Dreamweaver, it produces horrible code", but when you actually use the software as a editor and don't use the "design view", The only "bloated code" in it is the code you put in there yourself.

 

 

but...but Dreamweaver is a .......coding software that allows you to have design view as you code... Muse and Edge are the opposite they are code generating programs.

 

 

I have used Muse, and while I think it's a junk program Im not going to talk about it other than saying that.

If you plan on doing web development, especially as a full time job for someone (as opposed to freelance), then there is no way around it, you must know code. If you are freelancing you can get around it... but honestly it is much better to understand the code because it is your craft and you should understand the code.

 

That is all.

 

This...

Edited by D.Schuster

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.