| 150 | | For this task, you do not need to make a theme that can be used directly in Eden (though you certainly can if you want, and if you already have an Eden development environment, this is certainly an option to consider). Rather, you can make a few pages representing a mock web site, to show how you want your site to appear |
| | 150 | For this task, you do not need to make a theme that can be used directly in Eden (though you certainly can if you want, and if you already have an Eden development environment, this is certainly an option to consider). Rather, you can make a few pages representing a mock web site, to show how you want your site to appear and behave. The pages should have functioning widgets (e.g. menus, buttons, popups), though they don't have to submit forms or open other pages. Try to control the appearance mainly through CSS rather than hard-coding it into the HTML. |
| 156 | | What to do for this task: |
| 157 | | |
| 158 | | Make three pages of different types, one each from the three sets of options that follow. See the list of page types in the [#Developinganewtheme Developing a new theme] section, which points to examples of each kind of page. |
| | 156 | ==== A little philosophy ==== |
| | 157 | |
| | 158 | ''Think of a specific purpose for your site. For instance, some of the example sites are for logistics -- managing supplies and transportation, others are for matching donations and requests, or for managing projects, or for managing people, or for responding to emergencies, etc. etc. So there are lots of ways to use Eden. Maybe think of something that could be useful in your community.'' |
| | 159 | |
| | 160 | ''Then make a style and layout that serves that specific purpose. Think of how people will use the site, and what actions they want to do while there. Use the site purpose to guide your choice of what actions you provide on each page. Use your imagination -- try something unique, but also keep in mind that it should be practical for the users.'' |
| | 161 | |
| | 162 | ''Part of the design is how active elements like buttons, menus, popups, tabs, cards, spinners, throbbers, etc. are used. What will be convenient for your users? Are there new web technologies that might improve the "look and feel"?'' |
| | 163 | |
| | 164 | ''This is partly a learning experience for you, in using CSS and Javascript, JS libraries like Bootstrap and jQuery, new web standards like HTML5. The field that this task is an introduction to is "web design" -- a very popular part of web development and a good thing to know. So this is a good opportunity to try out the tools and techniques.'' |
| | 165 | |
| | 166 | ''It's also partly for Sahana -- for you to propose a different way of presenting information, maybe more appropriate than what we have for a particular purpose. Sahana is mainly about getting help to people who need it, so if you can make an advance in usability through your new theme, you're contributing to that goal.'' |
| | 167 | |
| | 168 | ==== What to do for this task ==== |
| | 169 | |
| | 170 | Please read the whole [#Developinganewtheme Developing a new theme] section. |
| | 171 | |
| | 172 | Since this is a theme, the page layouts, navigation elements, colors, and user interaction are the most important part. |
| | 173 | |
| | 174 | Make three pages of different types, one each from the three sets of options that follow. See the list of page types in the [#Developinganewtheme Developing a new theme] section, which points to examples of each kind of page. Again, ignore the "look and feel" of those examples -- just look at the sort of data they are trying to display. |
| 164 | | You don't need to include a lot of fake data. For instance, if you make a list view, there's no need to have more than two rows. If you make a component view that has tabs, you don't need a lot of tabs. Just include enough to show the layout you want. |
| 165 | | |
| | 180 | You can include more pages if they are important to your site's purpose (or you'd like to show your accomplishments!). |
| | 181 | |
| | 182 | Use active elements like menus, buttons, popups, etc. If it's important to the theme, have the active elements do something. (For instance, if you want to try a page with tabs for components, make clicking the tabs change which tab's data is shown. If you use a checkbox to show or hide options, have checking it actually show or hide the options.) |
| | 183 | |
| | 184 | You don't need to include a lot of fake data. For instance, if you make a list view, there's no need to have more than two rows. If you make a component view that has tabs, you don't need a lot of tabs. Just include enough to show the layout you want for the page that contains the tabs, and for the info in each tab. If you want to try bootstrap "cards", just put one or two in each card container. |
